1

ページでいくつかのフォーム要素を有効にするために、次の小さな Javascript スクリプトを作成しました。

function unHide()
{
    if($('#UserName').val() == "")
    {
        alert('Please Enter a User Name first');
    }
    else
    {
        $('#radio-choice-1').checkboxradio('enable');
        $('#radio-choice-2').checkboxradio('enable');
        $('#radio-choice-1-board').checkboxradio('enable');
        $('#radio-choice-2-board').checkboxradio('enable');
        $('#TransNum').textinput('enable'); 
        $('#UserContinue').remove();
        $('#nextButton').show();
    }
}

問題は、正しいボタンがクリックされたときにこれが呼び出されないことです。アラートすら表示されません。HTMLは次のとおりです。

<label for="UserName" style="vertical-align: top;">User Name:</label>
<input type="text" name="UserName" id="UserName" placeholder="Ex: LesniakBjEVS101" />

...

<a data-role="button" data-icon="check" data-mini="true" id="UserContinue"
    style="float:right;" onclick="javascript:unHide(); return false;">Continue...</a>

...

<section id="nextButton" hidden>
    <a href="salamanderSelect.html" data-role="button" data-icon="forward" 
             data-mini="true" style="float:right;">Next</a>
</section>

私が遭遇している問題は、送信ボタンをクリックしても何も起こらないことです。Javascript からのフィードバックも何もありません。

どんな助けでも大歓迎です！ありがとう！

編集：

提案を試した後も、JavaScript に何かをさせることができません。複数のブラウザを試しましたが、まだ何もありません。

そして、昨日もこれを機能させました...コードも変更しませんでした

編集2：

私のスクリプトがHTMLファイルの最後のものである場合、タグの外であっても機能するようです。

4

4 に答える 4

4

onclickすでにjQueryを使用しているので、不格好な属性を使用するのではなく、jQueryを使用してイベントを添付してみませんか。

<a data-role="button" data-icon="check" data-mini="true" id="UserContinue"
style="float:right;">Continue...</a>

$("#UserContinue").click(function(e) {
    if($('#UserName').val() == "") {
        alert('Please Enter a User Name first');
    }
    else {
        $('#radio-choice-1').checkboxradio('enable');
        $('#radio-choice-2').checkboxradio('enable');
        $('#radio-choice-1-board').checkboxradio('enable');
        $('#radio-choice-2-board').checkboxradio('enable');
        $('#TransNum').textinput('enable'); 
        $('#UserContinue').remove();
        $('#nextButton').show();
    }
    e.preventDefault();
});
于 2012-05-01T15:44:25.597 に答える
4

onclick は必要ありませんがjavascript:、多くのブラウザで動作するはずです。これがあなたの例のjsfiddleです：http://jsfiddle.net/ukWcp/2/

でのみ使用javascript:しますhref。

firebugまたはchromeでjavascriptコンソールとデバッガーを使用してデバッグすることをお勧めしますが、バインディングにすべてのjavascriptソリューションを使用することについて他の人が言及しています。それが好ましいです。

于 2012-05-01T15:41:59.250 に答える
1 
$(document).ready(function() {
    $("#UserContinue").click(function() {
        if($('#UserName').val() == "")
        {
            alert('Please Enter a User Name first');
        }
        else
        {
            $('#radio-choice-1').checkboxradio('enable');
            $('#radio-choice-2').checkboxradio('enable');
            $('#radio-choice-1-board').checkboxradio('enable');
            $('#radio-choice-2-board').checkboxradio('enable');
            $('#TransNum').textinput('enable'); 
            $('#UserContinue').remove();
            $('#nextButton').show();
        }

        return false;
    ); 
});

jQuery を使用している場合は、それを十分に使用してみませんか? 最後に false を返すと、クリック イベントの継続が必要な場合に停止します。

編集：

元の投稿で、「私が遭遇している問題は、送信ボタンをクリックしてもまったく何も起こらないことです。Javascript からのフィードバックも何も得られません。」

まだ不完全なアンカー タグにクリック イベントを添付しています (href がありません)。送信ボタンをクリックするか、アンカータグをクリックすると、動作がトリガーされることを期待していますか? 送信ボタンをクリックしたときにトリガーが起動することを期待している場合は、$("#UserContinue") を変更して、アンカー タグではなく送信ボタンを参照する必要があります。または、.click()、 http: //api.jquery.com/submit/ の代わりに .submit() イベント ハンドラを使用します。

これが問題でない場合は、投稿を編集してすべてのコードを含め、どの要素をクリックした後にどのような動作が期待されるかを伝えることをお勧めします。

編集2：

jQuery を .ready() 関数でラップしていないと思います。現在 .ready() を含む改訂されたコード スニペットを参照してください。.ready() は、jQuery を操作する前に DOM が完全に読み込まれるようにします。

于 2012-05-01T15:54:12.810 に答える
1

関数を保持し、イベント ハンドラーを javacript に追加し、マークアップには追加しません。

$(document).ready(function() { 
    $('#UserContinue').click(function() { 
       unHide();
    });
});

短縮版：

$(document).ready(function() { 
    $('#UserContinue').click(unHide);
});
于 2012-05-01T20:18:41.567 に答える