動的に生成された選択で動的に生成されたオプションでユーザーが選択したオプションの値を取得しようとしています。現在、アラートをポップアップさせようとしていますが、完全に失敗しています。
docuement.ready 内で .change バインダーを使用しようとしましたが、それは機能しませんでした。バインドする要素が存在しないことが原因である可能性があると考えました。.change のコード
$(document).ready(function () {
$(".lowerSerialSelect").change(function () {
alert("red")
});
});
選択を動的に生成するために使用しているコードは次のとおりです。
if (_interface == "network" && _deviceName == "Not in Use")
{
var lowerSerialTd = document.createElement("td");
lowerSerialTd.className = "lowerSerial";
trTag.appendChild(lowerSerialTd);
var lowerSerialSelect = document.createElement("select");
lowerSerialSelect.className = "lowerSerialSelect";
lowerSerialSelect.name = "lowerSerial" + identifier;
lowerSerialSelect.id = _interface + "lowerSerial" + identifier;
var lowerSerialOption = document.createElement("option");
lowerSerialSelect.appendChild(lowerSerialOption)
for (newDevice in newNetworkDevices)
{
alert(newNetworkDevices[0]);
var lowerSerialOption = document.createElement("option");
lowerSerialOption.innerHTML = newNetworkDevices[newDevice][0];
lowerSerialOption.className = "networkMacOption";
lowerSerialOption.id = _interface + "lowerSerial" + identifier;
lowerSerialOption.value = newNetworkDevices[newDevice];
lowerSerialSelect.appendChild(lowerSerialOption)
}
lowerSerialTd.appendChild(lowerSerialSelect);
alert("Maybe");
}
.change は、まだ作成されていない要素にバインドされませんか?
もしそうなら、新しい選択を作成するたびに再バインドすることでこれを回避できますか? (ユーザーは新しい選択をトリガーするため、すべてが一度に実行されるわけではありません)
$("select".on("change", "option", function() {alert("red");}); も試しましたが、役に立ちませんでした。ヘルプや説明をいただければ幸いです。
これは構成ページにあるため、コードはかなり長く、800行もあるため、すべてを投稿したくありませんでした.
ありがとう
** 編集 **
動的に生成される html は、最終的に次のようになります。
<select class="lowerSerialSelect" name="lowerSerial2" id="networklowerSerial2">
<option></option>
<option class="networkMacOption" id="networklowerSerial2" value="0080A39166BA,192.168.1.59,47331,1363895658.22">0080A39166BA</option>
</select>