如何使用jquery更改与特定类匹配的所有文本框的属性

Posted 2023-04-18

【中文标题】如何使用jquery更改与特定类匹配的所有文本框的属性

【英文标题】：how to change property of all text boxes matching particular class using jquery

【发布时间】：2012-07-05 16:53:46

【问题描述】：

这是我的 jquery 代码。 http://jsfiddle.net/geekrule/ZnAvP/1/ 当我选择图像时，会添加一个带有图像源的文本框并添加一个“名称”属性。现在当我取消选择图像时，我希望更新“名称”。 例如： i select images 1,3,4,5 corresponding value of 'name' of input boxes will be 1,2,3,4 and now when i unselect images -3,4 value of 'name' should be 1 and 2(this part is what i am stuck at.the values i get are 1,4). 他们没有得到更新。 希望你理解这个问题。请帮助我。在此先感谢

【问题讨论】：

@forsvarir 我做了一些更改。

【参考方案1】：

在我看来，更简单的解决方案是在每个图像选择上重新生成文本框：

<div id="selectList">
    <img src="http://tinyurl.com/26asnv7" />
    <img src="http://tinyurl.com/26asnv7" />
    <img src="http://tinyurl.com/26asnv7" />
    <img src="http://tinyurl.com/26asnv7" />
    <img src="http://tinyurl.com/26asnv7" />
    <img src="http://tinyurl.com/26asnv7" />
    <img src="http://tinyurl.com/26asnv7" />
    <img src="http://tinyurl.com/26asnv7" />
</div><form id='if' name='forms' method='post'>
<button type='submit' class="uploadPic">Upload Fb</button>
</form>
​
$(function() 
    $("#selectList img").click(
    function(event) 
        if( !$(this).is(".clicked") && $("#selectList img.clicked").length >= 3)
            event.preventDefault();
            alert('only 3 photos allowed');
            return;
        
        $(this).toggleClass("clicked");
        regenerateTextBoxes();
    );
);

function regenerateTextBoxes() 
    $('#if .selection').remove();
    $("#selectList img.clicked").each(function(index, element) 
        var $input = $('<div>', 
            'class': 'selection',
            'html': $('<input>', 
                'type': 'text',
                'value': $(this).attr('src'),
                'name': 'pics' + index
            )
        );

        $("#if").append($input);
    );
​