2

わかりました、これが問題です。成功用とエラー用の2種類のアラートボックスがあります。現在、zendベースのアプリケーションを使用していますが、ユーザーがプロファイルの更新や新規送信などのフォームに入力するたびに、これらのアラートボックスが表示されます。次に、各アラートボックスのクラス名をカスタムメイドして、エラーが発生した場合、Jqueryはアラートボックスにクラスを追加してボックスを表示しますか？以下は私の2つのアラートボックスです

成功：

 <div id="alert-container">
        <div class="info-alert alert-box-success">
            <p class="info-alert-text">
              // message will be custom added by jquery
            </p>
            <div class="bottom"></div>
        </div>
    </div>

エラー：

<div id="alert-container">
 <div class="info-alert alert-box-error">
  <p class="info-alert-text">
    // message will be custom added by jquery
  </p>
 <div class="bottom"></div>
</div>
</div>

これは私が現在Jqueryを使用してユーザーの送信を処理する方法です：

$("#send2friends_submit").on("click", function(){


              $('.share-event').attr('disabled',true);
              $('.share-event').addClass('ybtn-disabled');
                var f_mail = $.trim($('textarea#emails').val());
                var f_msg = $.trim($('textarea#emails-note').val());
                var f_eid = $('#eid').val();
                if(f_mail == '' || !validateEmail(f_mail)){
                $('.info-alert').show();
                $('#send2friends_submit').attr('disabled',false);
                $('#send2friends_submit').removeClass('ybtn-disabled');

                return ;
              }
              if(f_msg == ''){
                $('.info-alert').show();
                $('#send2friends_submit').attr('disabled',false);
                $('#send2friends_submit').removeClass('ybtn-disabled');

                return ;
              }
});

alert-box-error問題は、エラーが発生した場合に表示され、成功した場合alert-box-successにカスタムメッセージが表示されるように、ページごとに1つの一般的なアラートボックスを追加するにはどうすればよいですか？現在、ブロックとして表示した場合、エラーメッセージのみがinfo-alert表示されます。ありがとう

4

1 に答える 1

3

コンテンツと正しいクラスを追加する前.info-alertに、次のようになります。

$('.info-alert')
.removeClass('alert-box-error')
.addClass('alert-box-success')
.find('p')
.text('This is a success message')

そして、明らかにエラーの逆です。

基本的には、まず不要なクラスを削除してから、探しているクラスをコンテナに追加します。含まれている を探し、<p>それに応じてメッセージ テキストを編集します。

ここにあなたのための実用的なデモがあります

たった 1 つのジェネリックalert要素を使用して、成功メッセージとエラー メッセージを取得しました。

于 2013-03-05T02:09:46.137 に答える