Question

我似乎找不到正确的语法来实现这个目的：

 $.get('/templates/mytemplate.html', function (template) {

    $(template).find('select').append($("<option />").val(0).text('Please select ...'));
    $.each(dashboard.myArray, function () {
        $(template).find('select').append($("<option />").val(this.Id).text(this.Text));
    });
    $('#new-items').append(template);
});

模板变量只是一个html字符串，如：

"<form class="user-item"> 
    <select class=".sc" name="context" />
    <input type="hidden" name="id"/> 
    <input type="hidden" name="date"/>       
 <form>"

我已尝试在名称select上选择'select[name=context]'项目，并使用类似'.sc'的类选择器...似乎没有工作，但我有类似的代码工作其他地方很好很困惑。

Answer 1

问题是template是一个字符串。在你的情况下，你每次都为该元素创建一个新的jQuery包装并操作它但实际上并没有改变模板中字符串的内容，它只是在内存对象中更改另一个

你需要为模板创建一个新的jQuery包装器的引用，然后使用该引用进行dom操作，最后将它附加到容器元素

$.get('/templates/mytemplate.html', function (template) {
    var $template = $(template);
    $template.find('select').append($("<option />").val(0).text('Please select ...'));
    $.each(dashboard.myArray, function () {
        $template.find('select').append($("<option />").val(this.Id).text(this.Text));
    });
    $('#new-items').append($template);
});

演示：Problem，Solution

Answer 2

此类代码将起作用

var value = 'some_value',
    text  = 'some_text';

$('#id').append($('<option value='+value+'>'+text+'</option>'));

Answer 3

您的代码不起作用的原因是您正在修改变量但不将更改分配给变量

    $(template).find('select').append($("<option />").val(0).text('Please select ...'));

此行永远不会存储template的更改，应该是：

template = $(template).find('select').append($("<option />").val(0).text('Please select ...'));

将项目添加到下拉框中

3 个答案: