如何在ajax回调中选择无线电输入

时间:2014-07-29 16:26:58

标签: javascript jquery html ajax

我要制作一个自动填写的表格。在通过下拉(自动建议)列表选择用户名后,自动选择地址,电话,传真和部门等表格的选项。

整个过程完成。但只有一件事 - 单选按钮。我不知道如何从ajax的值返回中选择它。这是我的代码。

HTML

<form id="inst_name">
Address : <textarea name="addr" id="addr"></textarea>
Telephone : <input type="text" name="tel" id="tel" />

Department :
<input type="radio" name="dep" id="dep1" value="1" /><label>Dep 1</label>
<input type="radio" name="dep" id="dep2" value="2" /><label>Dep 2</label>
<input type="radio" name="dep" id="dep3" value="3" /><label>Dep 3</label>
</form>

的Javascript

$('#inst_name').blur(function(){        
    $.ajax({
        url: 'inc/autoform.json.php',
        dataType:'json',
        data: {name:$('#inst_name').val()},
        success: function(data){
            $('#inst_addr').val(data.addr);
            $('#inst_tel').val(data.tel);
            $('#hidden_dep').val(data.dep);
        }
    });
});

例如,如果ajax返回 data.dep =&#34; 1&#34; ,则应选择 Dep 1

4 个答案:

答案 0 :(得分:1)

$("#inst_name input[value="+data.dep+"]").prop("checked", true);

编辑添加说明:

无线电输入全部共享相同的名称,但它们是不同的html元素,因此您需要选择其值与您收到的值相匹配的输入并进行检查。

要选择其值为您正在寻找的单选按钮,请使用以下代码:  $("#inst_name input[value="+data.dep+"]")

然后您只需使用以下代码进行检查: .prop("checked", true);

答案 1 :(得分:1)

通过在成功回调中调用val(),您只需为元素指定一个值。

您可能希望操纵回调中元素的checked属性。

$('#inst_addr, #inst_tel, #hidden_dep').prop("checked",true);

答案 2 :(得分:1)

您可以简单地遍历它们,然后检查与该值匹配的那个。

 $("[name=dep]").each(function(i,v){
     var dep2 = $(this).val();
     if(data.dep == dep2) $(this).prop("checked",true);
 });

答案 3 :(得分:-2)

选择第n台电台

<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    </head>
    <body>
        <div id="inst_name">
            <input type="radio" name="dep" value="1" /><label>Dep 1</label>
            <input type="radio" name="dep" value="2" /><label>Dep 2</label>
            <input type="radio" name="dep" value="3" /><label>Dep 3</label>
        </div>
        <script>
        var n = 0;
        $($('#inst_name input:radio')[n]).prop('checked', true);
        </script>
    </body>
</html>