1

これは、OnChangeイベントを呼び出すのに問題なく機能します。

<FORM>
<SELECT ONCHANGE="alert(this.name + ' changed: ' + this.value)">
<OPTION VALUE="1">Option 1</OPTION>
<OPTION VALUE="2">Option 2</OPTION>
<OPTION VALUE="3">Option 3</OPTION>
</SELECT>
</FORM>

しかし、このスタイリングパッケージを使用すると、次のようになります。

https://web.archive.org/web/20161013011416/http://ryanfait.com/resources/custom-checkboxes-and-radio-buttons/

OnChangeイベントは機能しなくなりました。

<FORM>
<SELECT class="styled" ONCHANGE="alert(this.name + ' changed: ' + this.value)">
<OPTION VALUE="1">Option 1</OPTION>
<OPTION VALUE="2">Option 2</OPTION>
<OPTION VALUE="3">Option 3</OPTION>
</SELECT>
</FORM>

とにかく、custom-form-elements.jsを使用してOnChangeイベントを作成しますか？

4

2 に答える 2

1

答えはあなたがリンクしたページにあります;）

一番下までスクロールすると、次のようになります。

onChangeおよびその他のJavaScriptイベント

このスクリプトは、JavaScriptのonChangeおよびその他のイベントを利用します。これらのイベントは1回しか使用できないため、イベントに関数を追加する場合は、スクリプト内から呼び出す必要があります。

：：編集：：

および関数は両方とも、イベントで呼び出される関数Custom.clearです。したがって、私の推測では、jsファイルを次のように変更して、何が表示されるかを確認します。Custom.chooseonChange

clear: function() {
    // add your code here. example:
    alert(this.name + ' changed: ' + this.value);

    inputs = document.getElementsByTagName("input");
    for(var b = 0; b < inputs.length; b++) {
        if(inputs[b].type == "checkbox" && inputs[b].checked == true && inputs[b].className == "styled") {
            inputs[b].previousSibling.style.backgroundPosition = "0 -" + checkboxHeight*2 + "px";
        } else if(inputs[b].type == "checkbox" && inputs[b].className == "styled") {
            inputs[b].previousSibling.style.backgroundPosition = "0 0";
        } else if(inputs[b].type == "radio" && inputs[b].checked == true && inputs[b].className == "styled") {
            inputs[b].previousSibling.style.backgroundPosition = "0 -" + radioHeight*2 + "px";
        } else if(inputs[b].type == "radio" && inputs[b].className == "styled") {
            inputs[b].previousSibling.style.backgroundPosition = "0 0";
        }
    }
},
choose: function() {
    // add your code here. example:
    alert(this.name + ' changed: ' + this.value);

    option = this.getElementsByTagName("option");
    for(d = 0; d < option.length; d++) {
        if(option[d].selected == true) {
            document.getElementById("select" + this.name).childNodes[0].nodeValue = option[d].childNodes[0].nodeValue;
        }
    }
}

注：jsファイルにコードのチャンクを書き込む代わりに、clearおよび/またはchoose関数から独自のカスタム関数を1回呼び出すだけです。

于 2013-01-12T21:57:39.647 に答える
0

同じ問題に直面しました。これを修正する最もエレガントな方法ではないかもしれませんが、ラジオボタンをスパンタグ内に配置し、そこからonclickイベントを呼び出しました。このことは私を何日も夢中にさせました...これが役立つことを願っています

于 2013-01-28T20:07:38.503 に答える