Question

单次调用getJSON，效果很好......

<div class="col-sm-3 col-xs-12" >
    <label for="pickers" >Picker</label>
    <select name="Picker" id="selectPicker" class="form-control" ></select>
    <label for="grinners" >Grinner</label>
    <select name="Grinner" id="selectGrinner" class="form-control" ></select>
</div>

<script>
$( document ).ready( function() {

    //pickers
    $.getJSON( '/people.php', { get:'pickers' }, function( p ){

        var pOptions = '';
        for ( var pi=0; pi<=k['DATA'].length; pi++ ) {

            pOptions += '<option value="' + p['DATA'][pi][0] + '">' + p['DATA'][pi][1] + ' (' + p['DATA'][pi][2] + ')</option>';

        }

        $( '#selectPicker' ).html( pOptions );
    });



});
</script>

然而 - 当我添加另一个调用时，它会中断它们我接到调用，响应，就好了，正在返回JSON对象，但是UI没有填充选择...

以上作品，如果我添加这个（下面），它会打破两个选择... 我把所有变量命名为不同的，所以我不应该发生任何碰撞......

<script>
$( document ).ready( function() {

    //pickers
    $.getJSON( '/people.php', { get:'pickers' }, function( p ){

        var pOptions = '';
        for ( var pi=0; pi<=k['DATA'].length; pi++ ) {

            pOptions += '<option value="' + p['DATA'][pi][0] + '">' + p['DATA'][pi][1] + ' (' + p['DATA'][pi][2] + ')</option>';

        }

        $( '#selectPicker' ).html( pOptions );
    });

    //grinners
    $.getJSON( '/people.php', { get:'grinners' }, function( g ){

        var gOptions = '';
        for ( var gi=0; gi<=g['DATA'].length; gi++ ) {

            gOptions += '<option value="' + g['DATA'][gi][0] + '">' + g['DATA'][gi][1] + ' (' + g['DATA'][gi][2] + ')</option>';

        }

        $( '#selectGrinner' ).html( gOptions );
    });

});
</script>

JSON看起来像这样（仅供参考）：

选取器;

{

    "COLUMNS":["ID","PERSON","POSITION"],
    "DATA":[[1,"Jo Bob","Banjo"],[2,"Garth Waller","jug"],[3,"Boswell Higgins","washboard"]]

}

Grinners;

{

    "COLUMNS":["ID","PERSON","RELATION"],
    "DATA":[[1,"Jimmy John","Grand-pappy"],[2,"Margie Monroe","Grammy"],[3,"'big' Tom Turney","cousin/brother"]]

}

Answer 1

如果问题是URL捕获我的解决方案是将日期请求参数添加到URL，如

 '/people.php?d="+ new Date()

新的Date（）是当前的javascript日期。 Optionaly你可以进行一次调用并管理你的服务器代码，以便将两个响应一起返回。

Answer 2

对于这个特殊问题 - 我认为修复它的“一个”问题是我的for循环中的“＆lt; =”是错误的，它应该只是“＆lt;”。这似乎解决了这个问题。

 for ( var pi = 0; pi <= p['DATA'].length; pi++ ) {

应该是

 for ( var pi = 0; pi < p['DATA'].length; pi++ ) {

我需要确认我没有错过我的最后一个数组元素，但现在它可以工作。

然而 - 在我寻找解决方案的道路上，我的编码方式不同 - 这是一个对我有用的解决方案，我更喜欢（特别是在学习新东西时），我来接受关于JS的事。

哦，它可以毫无问题地进行多次通话。

$( document ).ready( function() {

        $.ajax({
            method: 'POST',
            url: '/game.cfm',
            data: { get:'pickers' },
            dataType: 'json',
            cache: false
        })
        .fail( function( jqXHR ) {

            $( "#msg" ).html( jqXHR.responseText + ' ' + jqXHR.statusText );

        })
        .done( function( data ) {

            if ( data['DATA'].length ) {

                var options = '';

                for ( var i = 0; i < data['DATA'].length; i++ ) {

                    options += '<option value="' + data['DATA'][i][0] + '">' + data['DATA'][i][1] + ' (' + data['DATA'][i][2] + ')</option>';

                }

                $( '#selectPicker' ).html( options );

            } else {

                $( '#selectPicker' ).html( '<option value="0" >No Selections Available</option>' );

            }

        });

        });

jquery getJSON被多次调用

2 个答案: