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

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

要求

• 点击下拉菜单 - >输入文字 - >打造成
  我会喜欢选择相应的表单元素，如标题，视图等。这是现在不在发生

• 当我点击创建时，它会一直提醒，我该如何避免这种情况？

我很新的jQuery和阅读的场所情侣，但没有找到解决的办法

谢谢

UPDATE
-------- ----

杰夫在小提琴中工作，但是当我把它放在我的代码上时，它没有点击。我把整个代码示例放在这个小提琴中 - 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); 
});