Question

请参阅以下HTML代码

<input id="product_code1" name="Samsung"><br>
<input id="product_code2" name="Apple"><br>
<input id="product_code3" name="Huawei"><br>
<input id="product_code4" name="Motorola"><br>

和jquery代码

$( "input[id*='product']" ).val( 'test' );

结果将显示4个文本框，其值为'test'作为默认值，但现在我想显示4个带有产品名称值的文本框，意味着第一个文本框将显示“三星”，第二个文本框将显示'Apple '＆amp;那么，我应该在jquery代码中输入什么命令？请指教。

Answer 1

只需使用.val(fn)：

$("input[id^='product_']").val(function() {
        return this.name;
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="product_code1" name="Samsung"><br>
<input id="product_code2" name="Apple"><br>
<input id="product_code3" name="Huawei"><br>
<input id="product_code4" name="Motorola"><br>

对于每个输入元素，它将调用将返回值设置的函数。

加成

为了使它更简洁，你可以考虑一个辅助函数，例如：

jQuery.prop = function(name) {
    return function() {
        return this[name];
    }
};

然后，代码变为：

$("input[id^='product_']").val($.prop('name'));

Answer 2

试试这个：

＆＃13;

$("input[id*='product']").each(function() {
  $this = $(this);
  $this.val($this.attr("name"));
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="product_code1" name="Samsung"><br>
<input id="product_code2" name="Apple"><br>
<input id="product_code3" name="Huawei"><br>
<input id="product_code4" name="Motorola"><br>

＆＃13;

Answer 3

$("input[id*='product']").each(function () {
    var $this = $(this);
    $this.val($this.prop("name"));
});

JSFiddle

jQuery：如何访问元素的名称

3 个答案:

加成