javascript - 要素 ID を Javascript 関数に渡す

Question

私の質問のタイトルに関連する多くのスレッドを見てきました。

HTML コードは次のとおりです。

<button id="button1" class="MetroBtn" onClick="myFunc(this.id);">Btn1</button>
<button id="button2" class="MetroBtn" onClick="myFunc(this.id);">Btn2</button>
<button id="button3" class="MetroBtn" onClick="myFunc(this.id);">Btn3</button>
<button id="button4" class="MetroBtn" onClick="myFunc(this.id);">Btn4</button>

そして、非常に単純な JS 関数がここにあります:

function myFunc(id){
        alert(id);
}

JsFiddleで確認できます。

問題は：

私にはわからない、おそらく機能this.idしないmyFunc、または他の問題があります。

どうしたの？

どんな助けでも大歓迎です。

score 14 · Accepted Answer

これはうまくいきます：

<!DOCTYPE HTML>
<html>
    <head>
        <script type="text/javascript">
            function myFunc(id)
            {
                alert(id);
            }
        </script>
    </head>

    <body>
        <button id="button1" class="MetroBtn" onClick="myFunc(this.id);">Btn1</button>
        <button id="button2" class="MetroBtn" onClick="myFunc(this.id);">Btn2</button>
        <button id="button3" class="MetroBtn" onClick="myFunc(this.id);">Btn3</button>
        <button id="button4" class="MetroBtn" onClick="myFunc(this.id);">Btn4</button>
    </body>
</html>

score 10 · Accepted Answer

デフォルトでは、jsFiddle では、スクリプトブロックに入力するコードは、window.onload で実行される関数にラップされます。

<script type='text/javascript'>//<![CDATA[ 
    window.onload = function () {
        function myFunc(id){
            alert(id);     
        }
    }
//]]>  
</script>

このため、関数myFuncはグローバルスコープにないため、html ボタンでは使用できません。オプションをNo-wrap in <head>Sergio が示唆するように変更すると、コードはラップされません。

<script type='text/javascript'>//<![CDATA[ 
    function myFunc(id){
       alert(id);     
    }
//]]>  
</script>

そのため、関数はグローバルスコープにあり、html ボタンで使用できます。

score 8 · Accepted Answer

これを使用できます。

<html>
    <head>
        <title>Demo</title>
        <script>
            function passBtnID(id) {
                alert("You Pressed:  " + id);
            }
        </script>
    </head>
    <body>
        <button id="mybtn1" onclick="passBtnID('mybtn1')">Press me</button><br><br>
        <button id="mybtn2" onclick="passBtnID('mybtn2')">Press me</button>
    </body>
</html>

score 7 · Accepted Answer

これを確認してください：http://jsfiddle.net/h7kRt/1/、

左上のjsfiddleを次のように変更する必要がありますNo-wrap in <head>

あなたのコードは見栄えがよく、通常のページ内で機能します。jsfiddle では、関数はロードハンドラ内で定義されていたため、別のスコープにあります。No-wrap に変更することで、グローバルスコープになり、必要に応じて使用できます。

score 0 · Accepted Answer

私にとっての問題は、Javascript をよく知らないという単純なことでした。シングルを使用する必要があったときに、二重引用符を使用してIDの名前を渡そうとしていました。そして、それはうまくいきました。

これはうまくいきました：

validateSelectizeDropdown('#PartCondition')

これはしませんでした:

validateSelectizeDropdown("#PartCondition")

そして機能：

    function validateSelectizeDropdown(name) {
    if ($(name).val() === "") {
         //do something
    }
}

javascript - 要素 ID を Javascript 関数に渡す

5 に答える 5

Related

Reference