0

、<ul id="keuze_lijst">id の入力フィールド、#sykjeおよび class のボタンがあります.search。

ボタンを押すと、ULをクリアしてデータを再入力したいので、現在この.jsファイルを取得しています。

$(document).ready(function() {
    $(".search").click(function(){
        var searchValue = $("#sykje").val();
        $("#keuze_lijst").empty();

        $.ajax({
            url: 'http://www.autive.nl/frysk/simulator/sim.php?action=getSongs&search='+searchValue,
            data: "",
            dataType: 'json',
            success: function(rows) {
                for(var i in rows){
                    var row = rows[i];
                    var id = row[1];
                    var titel = row[2];
                    var artiest = row[9];

                    $("#keuze_lijst").append("<li class='mag_droppen'>"+
                                    "<div class='song_left'>"+
                                    "<div class='titel'>"+titel+"</div>"+
                                    "<div class='artiest'>"+artiest+"</div>"+
                                    "</div><!-- .song_left -->"+
                                    "</li>");
                }

            }
        });
    });
});

ajax コマンドを削除して、次のようなものを配置すると、$("#keuze_lijst").html("hello");正常に動作します。しかし、ajax コマンドが機能しません。var searchValue彼の仕事はしますが。(ajax は正しい URL を使用します)。そして、そのURLを入力すると、ページは複数の行を持つ細かいjsonをエコーし​​ます。

しかし、私のページでは、ajax スクリプトは<li>.

私は何を間違っていますか？

編集: jsfiddle を追加 -> http://jsfiddle.net/TVvKb/1/

4

4 に答える 4

1

.html()HTML を完全に置き換えます。したがって、最後に、"#keuze_listが含まれます</li>。

html を文字列 var などにビルドした後、1 つの html() コマンドを実行するだけです。

于 2012-11-01T13:55:00.383 に答える
0

一見すると、問題はhtml()機能の使用にある可能性があると言えます。これにより、実際には html コンテンツ全体が置き換えられます。

append()またはを使用してみてくださいprepend()。

于 2012-11-01T13:55:25.283 に答える
0

確かではありませんが、.append()および他の jQuery メソッドに文字列を挿入すると、最初に (有効な) HTML に解析されると思います。これは、閉じられていないタグが閉じられていることを意味し、HTML が無効になります。

$('<div />'); // parses to <div></div>

したがって、DOM は次のようになると思います。

$('ul').append('<li>').append('foo').append('</li>'); // <ul><li></li>foo</li></ul>

最初に文字列をフォーマットしてください。jQuery ですべての入力を解析する必要はありません。

var str = '<li>';
str += 'foo';
str += '</li>';

$('ul').html(str);

クロスドメイン AJAX リクエスト (JSONP なし) の場合:

プロキシ.php

header('Content-Type: application/json');

if(empty($_GET['search'])) exit;

$url = 'http://www.autive.nl/frysk/simulator/sim.php?action=getSongs&search=' . $_GET['search'];

$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $url);
curl_exec($ch);
curl_close($ch);

Javascript

$.getJSON({
    url: 'proxy.php&search='+searchValue,
    success: callback
});
于 2012-11-01T14:14:31.730 に答える
0

考えられる問題:

Same Origin Problemが発生しています。デフォルトでは、独自のドメインに対してのみ Ajax リクエストを作成できます。クロスドメイン呼び出しを行う必要がある場合は、JSONPまたはCORSを使用してください。

一度だけ使用html()し、完全な文字列を渡してください。そうしないと、以前の html が常に上書きされます。

successエラー (無効な JSON など) が原因でハンドラーに到達していません。

于 2012-11-01T13:55:43.480 に答える