0

ユーザーが選択ボックスをクリックすると、Ajax も発生します。

このイベントは、選択ボックスにオプションを配置します。

オプションが選択ボックスに配置された後、ユーザーはそれらをクリックできるようになります。

Chrome では、ドロップダウン リストをクリックすると [1 つ選択] が表示されますが、オプションが追加された後もリストは [1 つ選択] のままであり、ユーザーは下矢印キーを押して選択できますが、"それらが追加された後、オプションのドロップダウンリスト」。

クロムで 2 回目のクリックをしなくても、表示されているこのドロップダウン リストを更新する JS や jQuery の魔法の部分は何ですか?

オプションをクリックすると、これが JS 経由で実行されます。

secBox = document.getElementById('sel34541_75');
secBox.length = 1;
addOption(secBox, "Option 1", "execPopDrop('sel34541_75', 34541, 'Option 1', 'type1', 'page.php')");
addOption(secBox, "Option 2", "execPopDrop('sel34541_75', 34541, 'Option 2', 'type2', 'page.php')");
addOption(secBox, "Option 3", "execPopDrop('sel34541_75', 34541, 'Option 3', 'type3', 'page.php')");
addOption(secBox, "Option 4", "execPopDrop('sel34541_75', 34541, 'Option 4', 'type4', 'page.php')");

オプション機能の追加は次のようになります。

function addOption(selectbox, text, value) {
  selectbox.options[selectbox.options.length]=new Option(text,value);
}

クリックしてから下矢印を押すと、動的オプションが表示されますが、リストには表示されません。(これも IE と FF で動作します)

下矢印をクリックすると、動的オプションが表示されます

もう一度クリックすると、ドロップダウンに正しいオプションが表示されます

もう一度クリックすると、ドロップダウンに正しいオプションが表示されます

4

1 に答える 1

0

これを試してください - すべてのブラウザで動作します - IE4 のサポートが必要な場合は、オプションを追加する前に options.length に 1 を追加する必要があります;)

この解決策を元の質問に更新してください

function addOption(selectbox, text, value) {
  selectbox.options[selectbox.options.length]=new Option(text,value);
}

しかし、なぜその恐ろしい文字列をオプションに追加するのですか?

値の文字列を (震える) EVAL するように見えます

なぜだめですか

addOption(secBox, "Option 1", "sel34541_75");

そして execPopDrop で選択を渡すと、次のようになります

function execPopDrop(sel) {
  var val = sel[sel.selectedIndex].value;
  var txt = sel[sel.selectedIndex].text;
  var type="type"+val.split(" ")[1]; // from Option 1
  var parm2 = val.replace(/[sel_]/g,""); // 34541
  // here you have all the stuff you need to do whatever you did before
}
于 2013-02-12T14:28:26.047 に答える