Question

我正在尝试从JSON格式的另一个页面（ajaxuseradd.psp）中提取文本。然后我尝试将此文本插入到几个文本框和/或选择列表中。现在，我只是想做文本框。

这是我的代码，其中有很多是给我的，因为我对jQuery并不熟悉：

<script type="text/javascript" src="jquery-1.7.min.js"></script>
<script type="text/javascript">
$('#username').change(function() {
    var userName = $(this).val();
    $.ajax({
        type: 'GET',
        url: 'ajaxuseradd.php',
        data: {
            uname: userName
        },
        success: function(data, status, xhr) {
            $.each(data, function(key, value) {
                $('#' + key).val(value);
            });
        },
        dataType: 'json'
    })
});

</script>
<form action="adduser.psp" method="get">
<fieldset>
    <label for="uname">Username:</label>
    <select name="uname" id="useruname" onchange="updateAdduser();">
<%
Random Python Code That Isn't Important But Generates Option Values
%>


<%= options %>

</select>

</fieldset>
<fieldset>
    <label for="fname">First Name:</label>
    <input type="text" name="fname" />
</fieldset>
<fieldset>
    <label for="lname">Last Name:</label>
    <input type="text" name="lname" />
</fieldset>
<fieldset>
    <label for="email">Email:</label>
    <input type="text" name="email">
</fieldset>

ajaxuser.psp的输出应如下，或其某些变体。当使用参数？uname = neverland时，这将显示在页面ajaxuser.psp上，例如：

{"fname" : Neverland, "lname" : Conference Room, "email" : nobody@mediaG.com, "deptid" : deptid, "active" : active, "sentient" : sentient}

所以我的代码应该是这样的吗？

<script type="text/javascript" src="jquery-1.7.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
    $('#username').change(function() {
    var userName = $(this).val();
        $.ajax({
            type: 'GET',
            url: 'ajaxuseradd.php',
            data: {
                uname: userName
            },
            success: function(data, status, xhr) {
        $("#fname").val(data.fname);
                });
            },
            dataType: 'json'
            })
        });
});


</script>

编辑：这仍然不起作用 - 我为任何字段选择了一个下拉值，并且没有更改。

Answer 1

我看到的第一件事是你需要在其中包装onchange处理程序：

$(document).ready(function () {

});

所以它看起来像这样：

$(document).ready(function () {
    $('#username').change(function() {
    var userName = $(this).val();
        $.ajax({
            type: 'GET',
            url: 'ajaxuseradd.php',
            data: {
                uname: userName
            },
            success: function(data, status, xhr) {
                $.each(data, function(key, value) {
                    $('#' + key).val(value);
                });
            },
            dataType: 'json'
            })
        });
});

另外，这个：

$.each(data, function(key, value) {
    $('#' + key).val(value);
});

不会像你想的那样工作。你得到了一个带有属性的对象，所以更像这样：

success: function(data, status, xhr) {
    $("#fname").val(data.fname);
    ....
},

尝试在选项值选择时自动将文本插入文本框

1 个答案: