0

ループ時にjsonから値を取得し、値とテキストの両方のチェックボックスを入力しますが、間違った出力を取得しています。属性値からのテキスト値との違いです

私のループ:

$.map(data["allLocales"], function(value, i){
    if(i % 5 === 0 ){
        col0 += "<label><input value="+ value.name +" type='checkbox' />"+value.name+"</label>"
    } else if(i % 5 === 1) {
        col1 += "<label><input value="+ value.name +" type='checkbox' />"+value.name+"</label>"
    } else if(i % 5 === 2) {
        col2 += "<label><input value="+ value.name +" type='checkbox' />"+value.name+"</label>"
    } else if(i % 5 === 3) {
        col3 += "<label><input value="+ value.name +" type='checkbox' />"+value.name+"</label>"
    } else if(i % 5 === 4) {
        col4 += "<label><input value="+ value.name +" type='checkbox' />"+value.name+"</label>"
    }
})

間違った html の例:

<label class="blue"><input value="Italian" type="checkbox">Italian</label>
<label class="blue"><input value="Italian" (italy)="" type="checkbox">Italian (Italy)</label>
<label class="blue"><input value="Italian" (switzerland)="" type="checkbox">Italian (Switzerland)</label>

ここで何が問題なのですか..? 属性とテキスト値の両方が同じである必要があります

4

1 に答える 1

2

結果を適切に引用していないようです。これは、スペースを扱う場合に特に重要です。例えば、

    "<label><input value="+ value.name +" type='checkbox' />"+value.name+"</label>"

Italian (italy)次のようにレンダリングされている場合:

    <label><input value=Italian (italy) type='checkbox' />Italian (italy)</label>

(italy)は、HTML5 仕様に従って空白の属性として扱われ、値が"".

これを修正するには、値を出力する場所に引用符を追加します。

    "<label><input value='"+ value.name +"' type='checkbox' />"+value.name+"</label>"

レンダリングする必要があります:

    <label><input value='Italian (italy)' type='checkbox' />Italian (italy)</label>

出力される値に含まれる可能性のある文字をエスケープすることを検討することも'できますが、それらが現在のデータセットの一部であるという証拠はありません。

于 2013-07-15T12:50:46.083 に答える