Question

我这里有一个jsfiddle - http://jsfiddle.net/9kKXX/20/

我的jQuery功能

$(function() {
    $('form input[type="text"]').live('keyup', function() {
        var val = $.trim(this.value);
        $('form .create-playlist-button').prop('disabled', val.length == 0).click(function(){
            alert('ALERT TITLE HERE');
          });
    });
});

要求

点击下拉菜单 - ＆gt;输入文字 - ＆gt;点击创建
我想选择相应的表单元素，如标题，视图等。现在不会发生这种情况
当我点击“创建”时，它会一次又一次地保持警报，我该如何避免？

我是jQuery的新手并且阅读了几个地方但没有找到解决方案

谢谢

更新
的 ------------

Jeff的答案在小提琴中起作用，但当我把它放在我的代码上时，它在点击时没有任何作用。我将整个代码示例放在这个小提琴中 - http://jsfiddle.net/rDe9V/，请帮助我理解这里出了什么问题

Answer 1

这里发生了一些事情。 Here is the final fiddle

首先，您每次触发关键字事件时都会绑定点击事件。这意味着警报将至少为播放列表标题中的每个字符触发一次。您甚至需要在准备好文档时绑定点击。

$(function() { $('form input[type="text"]').live('keyup', function() { var val = $.trim(this.value); $('form .create-playlist-button').prop('disabled', val.length == 0) }); $('form .create-playlist-button').click(function(){ alert('ALERT TITLE HERE'); }); });

第二次，您正在使用重复的ID。
页面上有许多元素
<div id="video-detail">

ID必须是唯一的。您应该将这些更改为类。

<div class="video-detail">

第三次，您可以通过遍历DOM树到单击按钮和标题之间的共同祖先来访问标题，遍历到标题。假设您将ID更改为类，则如下所示：

$('form .create-playlist-button').click(function(e){ var title = $(e.target).closest('.video-detail').find('.title').text(); alert(title); });

您可以转到my fiddle to see the final product。

Answer 2

由于我的声誉，我无法发表评论，但新问题是您正在搜索class而不是id。

您的代码：

$('.item').live('click', function(){
    // alert(this.id);
    var url = $('#video-frame').attr('src');
    var new_url = url.replace(/embed\/[\w -]*/g, 'embed/' + this.id);
    $('#video-frame').attr('src', new_url);
});

正确的代码（第一行）：

$('#item').live('click', function(){
    // alert(this.id);
    var url = $('#video-frame').attr('src');
    var new_url = url.replace(/embed\/[\w -]*/g, 'embed/' + this.id);
    $('#video-frame').attr('src', new_url);
});

jQuery：如何选择已单击相应按钮的表单元素？

2 个答案: