1

这是我的代码的一部分：

$.post('category.php',{datatosend : datatosend},result);

function result(data) {
    $('#placeHolder').append('<select onchange="loadcats();" id="categoryPID" name="categoryPID" >').append(data).append('</select>');  
    alert($('#placeHolder').html());
    });
}

我想在警报中有这个 HTML：

<select onchange="loadcats();" id="categoryPID" name="categoryPID">
<option value="37">computer</option><option value="38">mobile</option>
</select>

但结果是：

<select onchange="loadcats();" id="categoryPID" name="categoryPID"></select>
<option value="37">computer</option><option value="38">mobile</option>

为什么，我应该怎么做？！谢谢。

4

2 回答 2

1

这出现了很多，这是由于对.append()函数的作用有误解。人们似乎觉得它与将 HTML 字符串连接到innerHTML所选元素的属性相同，但事实并非如此。

该.append()函数适用于实际的 DOM 元素。如果您传入一个字符串，那么它会将其解析为 HTML，创建元素，然后将它们附加到所选元素。所以当你这样做时：

$('#placeHolder').append('<select onchange="loadcats();" id="categoryPID" name="categoryPID" >')

它创建整个<select>元素（它不在乎您没有关闭标签，它会为您完成），然后将其附加到#placeHolder. 然后，当您调用 时.append(data)，它会再次创建选项元素，然后将它们附加到<select>.

最好的办法是<select>单独创建元素，将<option>元素添加到其中，然后将其附加到#placeHolder：

// create the entire <select> element
var select = $('<select onchange="loadcats();" id="categoryPID" name="categoryPID" >');
// append the <option> elements to it
select.append(data);
// append the <select> to #placeHolder
$('#placeHolder').append(select);
// then finally alert its HTML
alert($('#placeHolder').html());

实际上可以将这些调用中的大多数链接起来，但我将其拆分出来纯粹是为了说明正在发生的事情。链式版本看起来像这样：

alert($('#placeHolder').append($('<select onchange="loadcats();" id="categoryPID" name="categoryPID" >').append(data)).html());
于 2013-04-04T11:52:23.677 回答
0

尝试这个：

$('#placeHolder').append('<select onchange="loadcats();" id="categoryPID" name="categoryPID" >');
$('#categoryPID').append(data);
于 2013-04-04T11:44:48.747 回答