0

返されたjsonデータをループしている次のjqueryコードがあります。何らかの理由で、テキストとしてではなく値として割り当てられたときに郊外をスペースで分割しているため、なぜこれが起こっているのかわかりません。

マイコード

$.each(data , function( index, obj ) {
                    $.each(obj, function( key, value ) {
                        var suburb = $.trim(value['mcdl01']);
                        var number = $.trim(value['mcmcu']);
                         $("#FeedbackBranchName").append("<option value=" + suburb + ">" + suburb + " (" + number + ")</option>");
                    });
                });

返される結果の例

<option **value="AIRLIE" beach=""**>AIRLIE BEACH (4440)</option>
<option value="ASHMORE">ASHMORE (4431)</option>
<option **value="BANYO" commercial=""**>BANYO COMMERCIAL (4432)</option>
<option value="BEENLEIGH">BEENLEIGH (4413)</option>
<option value="BERRIMAH">BERRIMAH (4453)</option>
<option **value="BOWEN" hills=""**>BOWEN HILLS (4433)</option>

AIRLEE BEACH、BANYO COMMERICAL、および BOWN HILLS では、2 番目の単語が value 属性から分離されていますが、テキスト レベルでは問題ありません。

なぜこれが起こるのか誰にも分かりますか？

ありがとう

4

3 に答える 3

2

一般に、新しい HTML 要素を作成するときは、jQuery に適切なエスケープを行わせるのが最善です。

$.each(obj, function( key, value ) {
    var suburb = $.trim(value['mcdl01']),
    number = $.trim(value['mcmcu']);

    $("#FeedbackBranchName").append($("<option/>", {
        value: suburb,
        text: suburb + " (" + number + ")"
    }));
});

Optionコンストラクターを使用することもできます。

$("#FeedbackBranchName")
   .append(new Option(suburb + " (" + number + ")", suburb));
于 2013-07-01T23:10:19.223 に答える
1

これは、value属性を引用符で囲んでいないためです。

実際に生成される HTML は次のとおりです。

<option value=AIRLIE BEACH>AIRLIE BEACH (4440)</option>

これは、ブラウザによって次のように解釈されます。

<option value="AIRLIE" BEACH="">AIRLIE BEACH (4440)</option>

これを修正するには、次のように値を引用符で囲みます。

$("#FeedbackBranchName")
    .append('<option value="' + suburb + '">' + suburb + " (" + number + ")</option>");

または、HTML を文字列として構築する代わりに、jQuery を使用して値を設定します。

$("#FeedbackBranchName").append(
    $("<option />")
        .val(suburb)
        .text(suburb + ' (' + number + ')')
);
于 2013-07-01T23:07:42.813 に答える