0

我在这里有一个 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 很陌生，阅读了几个地方，但没有找到解决方案

谢谢

更新
------------

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

4

2 回答 2

1

这里发生了一些事情。这是最后的小提琴。

首先，每次触发 key up 事件时，您都在绑定 click 事件。这意味着警报将针对播放列表标题中的每个角色至少触发一次。即使文档准备好，您也需要绑定单击。

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

你可以去我的小提琴看看最终的产品。

于 2012-07-10T13:44:13.877 回答
0

由于我的声誉，我无法发表评论，但新问题是您正在搜索 aclass而不是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);
});
于 2012-07-10T15:15:55.497 回答