2

次のコードを実行すると、ラジオ ボタンのテキストがレンダリングされないのはなぜですか。

<div id='sctices'></div>​

var result = [
               {"id":"G84","value":"Mman, J"},
               {"id":"G95","value":"Ekara, G"},
               {"id":"G98","value":"Gedala, PS"}
             ];


var key, count = 0;
for(key in result) 
{
  var btnId = result[key].id;
  var btnValue = result[key].value;

    var radio = $("<input></input>",
    {
         type: 'radio',
         name: 'gtice',
         class: 'radio-default',
         checked: false,
         value: btnValue,
         id: btnId,
         text: btnValue
    });

//radio.text(btnValue);// did not work
radio.insertAfter("#sctices");
radio.wrap("<div></div>");
}

助けてください。奇妙なことに、テキストは生成されたソースに表示されます。ありがとう

4

2 に答える 2

3

これは、radio入力にテキストが表示されないためです。一般的な方法は、そのためにlabel要素を一緒に使用することです。次の行を追加してみてください:

var $label = $("<label></label>").text(btnValue).prepend(radio);

フィドルの例

于 2012-07-30T15:35:47.083 に答える
0

これが私のバージョンです

ソースは私の意見ではよりきれいに見えますデモ

var result = [
    {
    "id": "G84",
    "value": "Mman, J"},
{
    "id": "G95",
    "value": "Ekara, G"},
{
    "id": "G98",
    "value": "Gedala, PS"}
];


var key, count = 0;
for (key in result) {
    var btnId = result[key].id;
    var btnValue = result[key].value;
    var $div = $('<div/>');
    var $radio = $("<input/>", {
        type: 'radio',
        name: 'gtice',
        class: 'radio-default',
        checked: false,
        value: btnValue,
        id: btnId,
    });

    var $label = $("<label/>",{ 'for' : btnId}).text(btnValue);
    $("#sctices").append($div.append($radio).append($label));
 }

結果:

<div id="sctices">
  <div>
    <input type="radio" name="gtice" class="radio-default" value="Mman, J" id="G84">
    <label for="G84">Mman, J</label>
  </div>
  <div>
    <input type="radio" name="gtice" class="radio-default" value="Ekara, G" id="G95">
    <label for="G95">Ekara, G</label>
  </div>
  <div>
    <input type="radio" name="gtice" class="radio-default" value="Gedala, PS" id="G98">
    <label for="G98">Gedala, PS</label>
  </div>
</div>
于 2012-07-30T15:36:02.303 に答える