jquery递增html中的数字name=""&"

jquery incrementing number in html name=""

本文关键字：quot name 数字 递增 html jquery      更新时间：2023-09-26

每次添加新的<input /> 时，我都希望变量inputname增加1

例如

<input name="1" />

<input name="2" />

<input name="3" />

---html---

<p class="add">Add</p>
<div class="added"></div>

---jQuery/javascript---

$(document).ready(function() {
    $("p.add").click(function() {

        var inputname = somevar;
        var added = "<input type='"text'" name='""+inputname+"'" />";
        $("div.added").append(added);
    });
});

 

如果有帮助的话，它在jsfiddle.net上->http://jsfiddle.net/gamepreneur/54kzw/

像这样设置inputname：

var inputname = $('.added input').length + 1;

这将获得添加的输入的总数，并以1为增量，从而产生新名称。

更改变量scope

使用此：

// declare your variable here so it exists throughout every call, instead of being
// delcared new with every call.
var inputname = somevar;
$(document).ready(function() {
    $("p.add").click(function() {
        var added = "<input type='"text'" name='""+(inputname++)+"'" />";
        $("div.added").append(added);
    });
});

备选方案：

  • 获取输入数($('div.added input').length(并将其用于计数器
  • 获取最后一个项目($('div.added input:last').prop('name')(的id并递增

您需要在全局范围中声明inputname，使其持续时间超过单击函数的持续时间，然后每次使用时都需要递增。

我把你的小提琴改成这样：http://jsfiddle.net/jfriend00/54kzw/2/

var inputname = 1;
$(document).ready(function() {
    $("p.add").click(function() {
        var added = "<input type='text' name='" + inputname++ + "' />";
        $("div.added").append(added);
    });
});

尝试

$(document).ready(function() {
    $("p.add").click(function() {
        var inputname = $('input', $("div.added")).length + 1;
        var added = "<input type='"text'" name='"" + inputname + "'" />";
        $("div.added").append(added);
    });
});

考虑添加一些其他选择器来选择这些输入(如类选择器(

相关文章：