Question

我有<script>：

// autocomplet : this function will be executed every time we change the text
function autocomplet() {
    var min_length = 0; // min caracters to display the autocomplete
    var keyword = $('#stock_name').val();
    if (keyword.length >= min_length) {
        $.ajax({
            url: 'search',
            type: 'POST',
            dataType: 'application/json',
            data: {keyword:keyword},
            success:function(data){
                $('#stock_list').show();
                $('#stock_list').html(data);
            }
        });
    } else {
        $('#stock_list').hide();
    }
}
// set_item : this function will be executed when we select an item
function set_item(item) {
    // change input value
    $('#stock_name').val(item);
    // hide proposition list
    $('#stock_list').hide();
}

使用谷歌Chrome开发工具时，我可以看到我得到回复：

{aktie: "Hoist Finance AB"}, {aktie: "Holmen AB ser. A"}, {aktie: "Holmen AB ser. B"}]
0: {aktie: "Hoist Finance AB"}
1: {aktie: "Holmen AB ser. A"}
2: {aktie: "Holmen AB ser. B"}

我想在div中显示JSON响应，但它不会显示出来！

    <div class="content">
        <form>
            <div class="label_div">Type a Stock : </div>
            <div class="input_container">
                <input type="text" id="stock_name" onkeyup="autocomplet()">
                <ul id="stock_list">asd</ul>
            </div>
        </form>
    </div>

我在jQuery文档中尝试了append，val和其他一些，但没有。

我的问题：如何在div stock_list中显示我获得的JSON响应？

Answer 1

为成功定义功能，如下所示。

将您的HTML代码更改为：

success:onSuccess

然后定义函数onSuccess()：

function onSuccess(data) {
    $('#stock_list').show().html("");
    $.each(data, function() {
            $("#stock_list").append("<li>" + this.aktie + "</li>");
        });
    }
}

Answer 2

必须解析您的json数据。在@Bfcm回答之后编辑，那就更好了

        success:function(data){
            $('#stock_list').show().html( "" );
            $.each(data, function() {
              $("#stock_list").append("<li> + this.aktie + "</li>");
            });
        }

JSON响应不会附加到div

2 个答案: