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 ;
              }
});

问题是,如何为每个页面添加 1 个通用警报框,以便在遇到错误时alert-box-error显示,如果成功则alert-box-success显示自定义消息?目前,如果我将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>并相应地编辑其消息文本。

这是给你的工作演示

您只使用一个通用alert元素就获得了成功和错误消息。

于 2013-03-05T02:09:46.137 回答