0

私はブートストラップを初めて使用し、アラートを生成するために以前は noty を使用していましたが、ブートストラップの負荷がすでに多少重いため、プラグインを追加せずにこれを試してみたいと思います。クラスを追加するだけで、テキストを簡単に作成できます。

これは私のJqueryです：

$(function(){
        $("#passsubmit").click(function(event){
        event.preventDefault();
        $(".error").hide();
        var hasError = false;
        var newpass = $("#password").val();
        var checkVal = $("#password-check").val();
        if (newpass == '') {
            $("#password").after('<span class="error">Please enter a password.</span>');
            hasError = true;
        } else if (checkVal == '') {
            $("#password-check").after('<span class="error">Please re-enter your password.</span>');
            hasError = true;
        } else if (newpass != checkVal ) {
            $("#password-check").after('<span class="error">Passwords do not match.</span>');
            hasError = true;
        }

        if(hasError == true) {return false;}

        if(hasError == false) {
                $.ajax({
                type: "POST",
                url: "resource/changepassword.php",
                data: {newpass:newpass},
                success: function(){
                    //alert("Password Changed");
                    $("#password").val("")
                    $("#password-check").val("");
                    $(document.createElement('<div class="alert alert-success">Password Changed</div>'));
                }
                });

        };
    });
});

これは、無効な文字が原因で失敗している部分であり、「

$(document.createElement('<div class="alert alert-success">Password Changed</div>'));

これをhtmlに単純に含めることができることを知っています：

<div class="alert alert-success" style="visibility: hidden">Password Changed</div>

そして、それを表示するだけですが、複数のページにまたがる多くの異なるアラートが必要な場合は特に良くありません...

これを行うためのより良い方法があるはずですか？

ありがとうございました ：）

4

1 に答える 1

3

構文が混同されているだけです：

  • document.createElement(tagName)
    • 単一のタグ名を文字列として 受け取る DOM メソッドです。
  • $(html)
    • 複雑な HTML 文字列を指定して DOM 要素を返す jQuery メソッドです。

通常は 1 つだけを使用し、それぞれを独自の目的に使用します。

次に、新しいものをどこに置きたいかを考え、div任意の DOM 挿入メソッド* を選択して、次のように呼び出します。

$('#selector').after('<div class="alert alert-success">Password Changed</div>');

これはフィドルで動作するデモです

スクリーンショット

* DOM 挿入タイプ:

他にも方法はありますが、これらはいくつかの一般的な方法です

于 2013-11-08T20:12:09.013 に答える