1

嘿，我正在尝试为我的每个表单元素分配一个唯一的 ID 号

这是我在http://jsfiddle.net/d0okie0612/22cTn/上工作的小提琴

继承人输出的 HTML

<div id="container">
  <div id="top_form">
    <form>
      Street: <input class="street" name="[][street]" id="form_element" type="text">               <br><br>
      City: <input class="city" name="[][city]" id="form_element" type="text">
      <select>
        <option value=" ">State</option>
        <option value="ca">CA</option>
        <option value="az">AZ</option>
        <option value="de">DE</option>
       </select>
       Zip: <input name="[][zipcode]" type="text"><br /><br />
     </form>
    </div>
  </div>

    <br />
       <a href="#" id="awsomeButton">+ Add Loction</a>
    <br />
     <br />
   <button id="submit_btn">Submit</button>

​</p>

这是jquery

var tpl = ""
+ "<div id='location_div_<%= id %>'><h1>My Location #<%= id %></h1></div>";

var newId = new Date().getTime();
var template = _.template(tpl);
var compiled = template({id: newId});

var addedForm = "<div id='added_form'>"
+ "<a href='#' class='close_btn'>x</a>"
+ "Street: <input name='[][street]' type='text'>"
+ "<br /><br />"
+ "City: <input name='[][city]' type='text'>"
+ "<select>"
+ "<option value=' '>State</option>"
+ "</select>"
+ "Zip: <input name='[][zipcode]' type='text'>"
+ "</div>"


$('#awsomeButton').on('click', 
function(e){
    $(addedForm).hide().appendTo('form').fadeIn('slow');

});

$('.close_btn').live('click', function(event){
event.preventDefault();
$(this).parents('div#added_form:first').fadeOut('slow', function(){
    $(this).remove();    

});
});

所以基本上我想要它，所以它说的地方 name='[][street]'

当我检查元素时，我希望从 newID 生成的唯一 ID 号显示在 [] 中。

所以例如

第一个位置 [0]street[0]state等

第二个位置 [1]street[1]state等

我是 jQuery 的新手，所以如果你可以编辑小提琴来实现这一点，或者你可以像六岁的孩子一样向我解释，那就太好了。

谢谢你

4

2 回答 2

3

您可以使用 replace(regex,newvalue) 这样做

var x = 0
$('#awsomeButton').on('click', function(e) {
    $(addedForm.replace(/[[]]/g, '[' + (x++) + ']')).hide().appendTo('form').fadeIn('slow');
});

在自动增加数字时它将替换为[]的位置。[x]

http://jsfiddle.net/HDUvG/

如果这对您来说太难理解，您可以进行拆分/加入 - 它会在任何有 a 的地方拆分成数组，[]并将其重新加入一个带有括号的字符串'[' + (x++) + ']'

$(addedForm.split('[]').join('[' + (x++) + ']')).hide().appendTo('form').fadeIn('slow');

http://jsfiddle.net/ffDEg/

于 2012-12-07T21:42:06.113 回答
0

您可以通过这样的方式为表单元素分配唯一 ID。

$(document).ready(function () {
    var elements = $('form input'),
    i;
    for (i = 0; i < elements.length; i++) {
        elements[i].id = "input-" + i;
    }
});

这给出了“#input-0”、“#input-1”等的值。

您可以通过使用示例进行测试来验证这是否有效，例如：

$('#input-1').css('background-color', 'red');
于 2012-12-07T21:54:54.593 回答