インターネットで見つかったドロップダウンの代替品を再利用しようとしましたが、2 つの問題が発生しました。
1) 代わりに、href を作成するのではなく、サブミットを作成してもらいたいです。関数を書き直して -tag に onChange を追加しようとしましたが、うまくいきませんでした。ヒントはありますか?
2)フラグを追加して機能を拡張し'<img class="option[selected]" />' +
、値の名前と画像のURLを含む2つのcssクラスを追加しようとしましたが、Javascriptの初心者であるため、有効なソリューションが見つかりません。
関数全体は次のとおりです。
$(document).ready(function() {
createDropDown();
$(".dropdown dt a").click(function() {
$(".dropdown dd ul").toggle();
});
$(document).bind('click', function(e) {
var $clicked = $(e.target);
if (! $clicked.parents().hasClass("dropdown"))
$(".dropdown dd ul").hide();
});
$(".dropdown dd ul li a").click(function() {
var text = $(this).html();
$(".dropdown dt a").html(text);
$(".dropdown dd ul").hide();
var langForm_mylang = $("#langForm_mylang");
langForm_mylang.val($(this).find("span.value").html())
});
});
function createDropDown(){
var langForm_mylang = $("#langForm_mylang");
var selected = langForm_mylang.find("option[selected]");
var options = $("option", langForm_mylang);
$("#langFormReplacement").append('<dl id="target" class="dropdown"></dl>')
$("#target").append('<dt><a href="#">' + selected.text() +
'<img class="$langCode" />' +
'<span class="value">' + selected.val() +
'</span></a></dt>')
$("#target").append('<dd><ul></ul></dd>')
options.each(function(){
$("#target dd ul").append('<li><a href="#">' +
$(this).text() + '<span class="value">' +
$(this).val() + '</span></a></li>');
});
}