如何 jQuery JavaScript 条件语句（初学者）-解网

问：

如果这是一个过于简单的问题，请道歉，但我的搜索一无所获。

我有一个jQuery函数，它在我的一些不包含输入的页面上产生错误：#message

Error: jQuery("#message").val() is undefined
Line: 56

还有我的jQuery函数：

function updateCountdown()
{
    var $left = 255 - jQuery( '#message' ).val().length;

    jQuery( '#countdown' ).text( $left + ' Characters Remaining' );
}

$( document ).ready( function()
{
    updateCountdown();

    $( '#message' ).change( updateCountdown );
    $( '#message' ).keyup( updateCountdown );
});

所以我的问题是，如何使用条件从没有输入的页面中删除错误消息？我相信我的问题是对 JavaScript 如何工作的基本知识缺乏了解。#message

JavaScript jQuery

改进选择器以确保它实际上正在获取输入元素（以便有一个值）。然后检查你的选择器是否真的匹配了任何东西，然后再使用它。请注意，返回的 jQuery 对象是匹配元素的数量（它必须大于 0）。哦，只要与其他 javascript 框架没有任何冲突，您就可以始终如一地使用该函数。length$

function updateCountdown() 
{
    var msg = $('input#message');
    if (msg.length > 0) { 
        var $left = 255 - msg.val().length; 

        $( '#countdown' ).text( $left + ' Characters Remaining' );
    }
}

0赞 mjobrien 2/17/2010 #2

您只需要检查jQuery对象是否包含任何项目。我会这样做。

$( document ).ready( function()
{
    var $message = jQuery( '#message' );
    if($message.length > 0) {
        updateCountdown();

        $( '#message' ).change( updateCountdown );
        $( '#message' ).keyup( updateCountdown );
    }
});

然后，我会更改您的函数以使用关键字，而不是执行另一个jQuery查找。jQuery 设置为发生事件的 DOM 元素。updateCountdown()thisthis

function updateCountdown()
{
    var $left = 255 - jQuery( this ).val().length;

    jQuery( '#countdown' ).text( $left + ' Characters Remaining' );
}

3赞 Pointy 2/17/2010 #3

我不会费心对从选择器返回的 jQuery 对象执行显式测试——让 jQuery 为您完成！

$(function() {
  $('#message').each(function() {
    var $self = $(this);
    $self.bind('change keyup', function updateCountdown() {
      $('#countdown').text((255 - $self.val().length)) + ' characters remaining');
    });
  });
});

如果“#message”与任何内容不匹配，则调用不会执行任何操作。.each( ... )

1赞 CurtainDog 2/17/2010 #4

唯一的问题是你的初始化代码。在那之后，它会运行良好。所以做：

$( document ).ready( function()
{
    $( '#message' ).change( updateCountdown ).keyup( updateCountdown ).keyup();
});

请注意链接的使用。

上一个：防止 Sublime Text 4 仅在通过文件启动时打开以前的文件

下一个：如何使用PHP获取Apache HTTP响应代码（或服务器响应的第一行）

如何 jQuery JavaScript 条件语句（初学者）

How To jQuery JavaScript conditional statement (beginner)

评论