单选按钮不用jquery更新

时间:2017-01-18 16:23:05

标签: jquery html ajax

我的代码中有单选按钮,希望它们在状态发生变化时像网页上的其他变量一样更新

HTML

<TD><Input id="radOn2" name="Nb_var86" type= "radio" Value=1 onClick="this.form.submit();">ON</TD>
<TD><Input id="radOff2" name="Nb_var86" type= "radio" Value=0 onClick="this.form.submit();">OFF</TD>

JavaScript

var timeout;
function bloop() {

    $.ajax({
        url: "/ajax.html",
        success:function(result){
            var array=result.split(','); 
            for(i=0;i<array.length;i++){
                $("input[name='Nb_var"+array[i].substring(0,array[i].indexOf(':'))+"']").val(array[i].substring(array[i].indexOf(':')+1));
            }
        }
    });

    timeout = window.setTimeout(function(){bloop()}, 4000);
}

对于我的生活,我无法弄清楚为什么收音机按钮不会更新。任何帮助表示赞赏。

我已尝试在Stack溢出中找到的其他示例,它们似乎不起作用。我的bloop函数更新了网页上的变量列表,但除非刷新页面,否则单选按钮(列表中的变量)不会更新。我想让jquery更新单选按钮状态而不刷新页面

以下是我的尝试: 我可以在页面上看到var,所以我知道服务器和ajax正在更新var:

<TD><Input id="radOn2" name="Nb_var86" type= "radio" Value=1 onClick="this.form.submit();">ON</TD>
<TD><Input id="radOff2" name="Nb_var86" type= "radio" Value=0 onClick="this.form.submit();">OFF<input readonly name= "Nb_var86"style="font-size: 105%;border:none;" value ="<Nb_var86>" size = 2></TD>

然后在脚本中我尝试了所有这些,但没有运气实际上翻转单选按钮:

if($("input[name=Nb_var86]:checked").val()==1){
    $('input:radio[name=Nb_var86][id=radon2]').click();
    //$("#radon2").prop("checked", "checked");
    //$('input:radio[name = Nb_var86]').val(['radon2']);
    //$('#radon2').attr('checked', 'checked');
    //$("input[name = Nb_var86] [id = radon2]").prop('checked', true);
    //$("#radoff2").prop("checked", false).val()==0;
    //$("#radon2").prop("checked", true).val()==1;

我错过了什么吗?

3 个答案:

答案 0 :(得分:2)

这是一个指向线程的链接,有很多选项供您尝试。您不想更改其值,但是是否已选中它。

jQuery set radio button

我个人喜欢道具选项,类似这样的

jQuery('[value="radio2"]').prop('checked', true)

以下是prop http://api.jquery.com/prop/

的文档

答案 1 :(得分:0)

使用道具?

$(&#34;#radOn2&#34;)丙(&#34;检查&#34;,TRUE);

等...

我想你也想要setInterval ......

var timeout;
function bloop() 
    $.ajax({
        url: "/ajax.html",
        success:function(result){
            var array=result.split(','); 
            for(i=0;i<array.length;i++){
                var arr = array[i];
                var num = arr.substring(0, arr.indexOf(':'));
                $("input[name='Nb_var"+num+"']").val(num+1).prop("checked",true));
            }
        }
    });
}

timeout = setInterval(function(){ bloop(); }, 4000);

我在这里用小提琴测试了这个: https://jsfiddle.net/k4zLvgyr/7/

小提琴没有AJAX,但它只是打开和关闭收音机...... 如果这有帮助,请告诉我。

答案 2 :(得分:0)

您可以使用道具或attr或val。

这里的例子是:

<!DOCTYPE html>
<html>
<body>

    <input id="radOn2" name="Nb_var86" type= "radio" value=1 onClick=""/>ON
    <input id="radOff2" name="Nb_var86" type= "radio" value=0 onClick=""/>OFF

   <p>Click in the button.</p>

   <button onclick="fn()">Try it</button>

   <script src="http://code.jquery.com/jquery-3.1.1.min.js">
   </script>
   <script type="text/javascript">
       function fn() {
           $("input[name=Nb_var86][value=1]").attr('checked', 'checked');
           $("input[name=Nb_var86][value=0]").prop('checked',true);
           $("input[name=Nb_var86]").val([1,0]); //With an array
           $("input[name=Nb_var86]").val([0,1]);
       }
   </script>
</body>
</html>