我提交时只在jQuery中显示一条消息

When I submit my form, I display a message in jQuery.

当我提交表单时,我在jQuery中显示一条消息。

I want it appears only once when I submit more than once

我希望它只出现一次,当我提交不止一次

$('form').submit(function(){
    if ($('#title').val() != '' && $('#comment').val() != '')
        $('form').append($('<span>').text('Bug sent').delay(4000).fadeOut(600));
    else
        $('form').append($('<span>').text('Fields are empty').delay(4000).fadeOut(600));

return false;
});

Example : http://jsfiddle.net/bUS8e/

示例:http://jsfiddle.net/bUS8e/

6 个解决方案

#1

Simply remove any existing spans in the form: http://jsfiddle.net/pimvdb/bUS8e/1/.

只需删除表单中的任何现有跨度:http://jsfiddle.net/pimvdb/bUS8e/1/。

$('form span').remove();

Note that this would also remove any other, irrelevant spans which you might not want to have removed. In that case, you can add a class to the message spans you add, and use $('form span.message').remove(); so that only those message spans get removed.

请注意,这也会删除您可能不想删除的任何其他不相关的跨度。在这种情况下,您可以在添加的消息范围中添加一个类,并使用$('form span.message')。remove();这样只删除那些消息跨度。

#2

Check if $('form').text() contains "Bug sent"? i.e.

检查$('form')。text()是否包含“Bug sent”?即

$('form').submit(function(){
    if ($('#title').val() != '' && $('#comment').val() != '')
        if (!/Bug sent/.test($('form').text()) {
            $('form').append($('<span>').text('Bug sent').delay(4000).fadeOut(600));
        }
    else
        $('form').append($('<span>').text('Fields are empty').delay(4000).fadeOut(600));

return false;
});

#3

Remove all spans when the user submits the form. Then add them again (if necessary):

用户提交表单时删除所有跨度。然后再次添加它们(如有必要):

Like this

#4

You could add the span to the HTML code and give it an ID. And instead of appending a new span everytime, you just reuse the existing one by addressing it via its ID.

您可以将范围添加到HTML代码并为其指定ID。而不是每次都附加新的跨度,您只需通过其ID来重用现有的跨度。

#5

Add a div (or any other element) to your form and use $('div').html([YOUR STUFF]) instead of $('form').append([YOUR STUFF]).

在表单中添加div(或任何其他元素)并使用$('div')。html([你的STUFF])而不是$('form')。append([你的STUFF])。

#6

You should clear the parent element before:

你应该在之前清除父元素:

$('form').submit(function(){
    if ($('#title').val() != '' && $('#comment').val() != '')
        $('form').empty().append($('<span>').text('Bug sent').delay(4000).fadeOut(600));
    else
        $('form').empty().append($('<span>').text('Fields are empty').delay(4000).fadeOut(600));

    return false;
});

#1