Question

似乎无法将eventlistener锁定到通过Javascript生成的下拉列表中。

生成的Html：

<select class="specialConditionsDropdown">
    <option value="-1" selected>Some Value</option>
</select>

Javascript我最终：

$(document).on("change", ".specialConditionsDropdown", function () {
console.log("I changed");
}, false);

我注意到通过javascript生成的任何html都不能与.change（）一起使用，所以我不得不使用.on（）来做同样的事情。我不确定为什么这会在下拉列表中获得更改，因为它适用于我用过的所有其他内容。

此外，还会通过javascript：

填充下拉列表

function PopulateSpecialConditionTables()
{
    $('.specialConditionsDetails').empty();

    for (var i = 0; i < SpecialConditions.length; i++)
    {
        if(SpecialConditions[i].Value != "None")
        {
            var specialConditionsTable = $(document.createElement('tr'));
            specialConditionsTable.wrapInner().html('<td style="width: 10px"><input       class="specialConditionCheckBox" type="checkbox" /></td>' +
                '<td class="specialConditionValue">' + SpecialConditions[i].Value + '</td><td class="specialConditionDescription">' + SpecialConditions[i].Description + '</td>');
            $('.specialConditionsDetails').append(specialConditionsTable);
        }
    }
}

以下是填充包含下拉列表的表的完整函数：

function PopulateDemographicTables(demographics)
{
$('.demographicDetails').empty();

for (var i = 0; i < demographics.length; i++)
{
    var demogrphicsTable = $(document.createElement('tr'));

    if (demographics[i].Name == "Special Conditions")
    {
        demogrphicsTable.wrapInner().html('<td style="width: 10px"><input class="demographicCheckBox" type="checkbox" /></td><td class="demographicName">' +
                demographics[i].Name + '</td><td class="demographicValue" spellcheck="false"><select class="specialConditionsDropdown">' +
                '<option value="-1" selected>' + demographics[i].Value + '</option></select></td>');
        SelectedSpecialCondition = demographics[i].Value
    }
    else
    {
        demogrphicsTable.wrapInner().html('<td style="width: 10px"><input class="demographicCheckBox" type="checkbox" /></td><td class="demographicName">' +
            demographics[i].Name + '</td><td class="demographicValue" spellcheck="false" contenteditable>' + demographics[i].Value + '</td>');
    }

    for (var j = 0; j < DefaultDemographics.length; j++)
    {
        if (demographics[i].Name == DefaultDemographics[j].Name && demographics[i].Value == DefaultDemographics[j].Value)
        {
            demogrphicsTable.find('.demographicCheckBox').attr("disabled", "disabled");
            demogrphicsTable.addClass("defaulted");
        }
    }

    $('.demographicDetails').append(demogrphicsTable);
}

}

Answer 1

你快到了。

$(document).on("change", ".specialConditionsDropdown", function () {
   console.log("I changed");
}); //Removed false from here

正确的语法是

.on（events [，selector] [，data]，handler（eventObject））

有关详细信息，请访问.on()

通过javascript生成的下拉列表的EventListener

1 个答案: