Question

我的页面中有多组单选按钮。每组都有两个选项Type Text或Upload Image。这些集合的数量是动态确定的，并使用Jquery在网页中创建。这两组单选按钮中的每一个都在一个表单中。

我的问题是我无法检测到任何这些单选按钮的更改。以下是我创建单选按钮的代码的一部分 -

anstypeforms[i] = $('<form style = "padding:5px; margin:5px;">').attr('id',
                    function(){
                        return 'AnsMethod'+quest[k].questionid;
                    }).appendTo($("#AnswerDiv"+quest[i].questionid));

其中$（“＃AnswerDiv”+ quest [i] .questionid是动态创建的<div> .quest [i] .questionid是一个数字。

单选按钮的创建如下 -

$('<input type="radio" name = "method" value = "TextMethod" checked = "checked" > Type Text </input>').appendTo(anstypeforms[i]);
$('<input type="radio" name = "method" value = "ImageMethod" > Upload Image </input>').appendTo(anstypeforms[i]);

以下是尝试检测任何按钮中的更改的代码段：

$( document ).ready(function() {
$("[id^='AnsMethod']").on('change', 'input[name=method]:radio', function(e) {
    e.preventDefault();

.......do something......

});
});

我哪里错了？

Answer 1

经过几次试验后，用迂回的方式让事情发生了。我首先为每个单选按钮指定了一个唯一的名称。然后我检测到任何单选按钮是否有任何变化。然后确定已更改的单选按钮的名称。使用名称继续使用其余代码 -

$('<input type="radio" class="rbutton" value = "TextMethod" checked = "checked" > Type Text </input>').attr('name', function(){
                                            return 'method'+quest[k].questionid;
                                            }).appendTo($("#AnswerDiv"+quest[i].questionid));
$('<input type="radio" class="rbutton" value = "ImageMethod" > Upload Image </input>').attr('name', function(){
                                            return 'method'+quest[k].questionid;
                                            }).appendTo($("#AnswerDiv"+quest[i].questionid));

这是识别码 -

$(document).on("change", 'input[type=radio]', function(e){
e.preventDefault();
var x = $(this).attr('name').substring(6);
var y = $(this).attr('value');
switch(y) {
    case 'TextMethod':
        ....do something....
        break;
    case 'ImageMethod':
         ....do something....
        break;
    }
});

Jquery单选按钮检测更改

1 个答案: