1

这是我的第一个问题,但我已经发现这个网站非常有帮助,所以感谢你们所有人。


所以这就是问题所在。我有一堆动态生成的带有文本区域的 div,我想遍历它们。这里的这个函数适用于我放入的静态测试 div,但不适用于动态创建的。

$jQ('#upload_images_button').on('click', function() {
    var caption_list = [];

    $jQ('textarea.upload_image_caption').each(

    function() {
        caption_list.push($jQ(this).val());
        document.write($jQ(this).val());
    });
});

这是每个 div 的 html:

<div class="upload_image_temp_wrapper">                                 
    <div class="upload_wrapper">
        <img src="/images/test/test.jpg" />

        <div class="temp_image_hover_menu">
            <input type="checkbox" checked="checked" />
        </div>
    </div>
    <div class="upload_image_caption_wrapper">
        <textarea class="upload_image_caption" type="text" placeholder="Add a description..."></textarea>
    </div>
</div>

编辑

天哪,我觉得自己像个白痴。

我回顾了生成新 div 的脚本,发现我忘记为 textareas 分配一个类......

无论如何,感谢所有的帮助。感谢所有快速的答案!

4

2 回答 2

0

像您所做的那样调用.on()不会将事件绑定为实时事件(因为缺少可选的选择器参数),这意味着它只会绑定到执行时存在的元素。如果您更改调用方式.on(),特别是将点击绑定到body,您可以将事件更改为在#upload_images_button按钮上生效:

$jQ('body').on('click', '#upload_images_button', function() {} );

另外,我不确定#upload_images_button您的页面上是否有多个按钮,但请记住 ID 必须是唯一的,因此如果您确实有多个此类元素,请使用类而不是 ID。

于 2012-06-22T04:00:10.887 回答
0

代码工作正常。您的错误在其他地方。示例:http: //jsfiddle.net/Buaja/

HTML

<button id="upload_images_button">Upload</button>
<button id="add-div">Add Div</button>

<div class="upload_image_temp_wrapper">                        
    <div class="upload_wrapper">
        <img src="/images/test/test.jpg" />

        <div class="temp_image_hover_menu">
            <input type="checkbox" checked="checked" />
        </div>
    </div>
    <div class="upload_image_caption_wrapper">
        <textarea class="upload_image_caption" type="text" placeholder="Add a description..."></textarea>
    </div>
</div>​

JS

$jQ('#upload_images_button').on('click',
    function(){
        var caption_list = [];

        $jQ('textarea.upload_image_caption').each(
            function(){
                caption_list.push($jQ(this).val());
                console.log($jQ(this).val());
            });     
    }
);

// Add divs dynamically
$jQ('#add-div').on('click', function() {
   $jQ(document.body).append($jQ($jQ(".upload_image_temp_wrapper")[0]).clone());
});

笔记

  • 不要使用 document.write,如果在页面加载后调用它会覆盖文档中的所有内容
于 2012-06-22T04:14:53.290 回答