Jquery 盘点新物品_Jquery_Counting

Jquery 盘点新物品

jquery

Jquery 盘点新物品,jquery,counting,Jquery,Counting,这是我的场景我有一个嵌套的可排序树 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html> <head> <title></title> </head> <body> <ul> <li id="item_123" name="123"> <fieldset cl

这是我的场景我有一个嵌套的可排序树

  <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
  <html>
   <head>
    <title></title>
   </head>
   <body>
    <ul>
     <li id="item_123" name="123">
      <fieldset class="additem">
       <input type="text" name="title" value="">
      </fieldset>
      <ul>
       <li id="item_253" name="253">
        <fieldset class="remove additem">
          <input type="text" name="title" value="">
        </fieldset>
       </li>
       <li id="item_252" name="252">
        <fieldset class="remove additem">
          <input type="text" name="title" value="">
        </fieldset>
       </li>
       <li id="item_250" name="250">
        <fieldset class="remove additem">
          <input type="text" name="title" value="">
        </fieldset>
       </li>
       <li id="item_247" name="247">
        <fieldset class="remove additem">
          <input type="text" name="title" value="">
        </fieldset>
       </li>
      </ul>
     </li>
    </ul>
   </body>
  </html>

现在，在这个字段集有一个additem类的地方，我想向树中添加新的项，这些项看起来像树中的所有其他项，我可以做到这一点，没有问题

我所做的就是添加一个添加按钮的jquery，并向其附加一个单击事件

我这里有我的大部分代码

 $(document).ready(function(){
  $('<p class="add">Add <img src="/add.png" alt="up.png" /></p>').click(function() {
   add_item(this);
  }).prependTo("fieldset.additem");
 }

 function add_item(btn){
  var li ='
   <li id="item_new'+ X+'" name="new"'+ X+'>'+
    '<fieldset class="remove additem">'+
      '<input type="text" name="title" value="">'+
    '</fieldset>'+
   '</li>';

  if(!$(btn).parent().next('ul').length) {
   $(btn).parents("li:first").append("<ul>"+li+"</ul>");
  }else {
   $(btn).parent().next("ul").prepend(li);
  }
 }

请注意，在上面的代码中，我调用了一个变量X，该变量必须是一个数字，以便新项目可以是唯一的，这就是我要寻找的，如何跟踪我放入树中的所有新项目

任何帮助都将不胜感激

编辑

我提到我使用x变量似乎有些草率，但我也想修改这个函数，这样我就可以使用它来添加各种不同的项目，这样我就可以使用新的+x或旧的+x来讨论全局变量了。我现在明白了，我看错了你的代码，我的回答只是针对你的评论，所以它是断章取义的

这就是我所说的x不是全局的，如果它是在文档中定义的。就绪：

关于全局变量的讨论。我现在明白了，我看错了你的代码，我的回答只是针对你的评论，所以它是断章取义的

这就是我所说的x不是全局的，如果它是在文档中定义的。就绪：

作为旁注，我可以在document ready中定义一个x=0的全局变量，但这似乎是懒惰和错误的，在document.ready函数中使用x变量没有什么错。它被限制在特定的回调函数中，因此不能在函数之外访问非全局函数，这怎么可能不是全局函数呢？如果我在document ready中定义了x，我的所有函数都会看到它。请注意，我可以在document ready中定义一个x=0的全局变量，但这似乎是懒惰和错误的。在document.ready函数中使用x变量没有错。它被限制在特定的回调函数中，因此不能在函数之外访问非全局函数，这怎么可能不是全局函数呢？如果我在documentready中定义x，我的所有函数都会看到它

<script type="text/javascript">

var global = "this is global";

$(document).ready( function() {
    var notGlobal = "this is confined to the callback function of document.ready()";
    alert(global + "\n" + notGlobal)
});

//Now we're back to the global scope. "notGlobal" is not reachable from here
//This will give an error, as "notGlobal" isn't defined in this scope
alert(global + "\n" + notGlobal);

</script>

$(document).ready(function(){
    var X = 0;

    $('<p class="add">Add <img src="/add.png" alt="up.png" /></p>')
    .click(function() {
        add_item(this,X);
        X++
    })
    .prependTo("fieldset.additem");

    function add_item(btn,X){
        var li = ''+
        '<li id="item_new'+ X+'" name="new'+ X+'">'+
            '<fieldset class="remove additem">'+
                '<input type="text" name="title" value="">'+
            '</fieldset>'+
        '</li>';

        if(!$(btn).parent().next('ul').length) {
            $(btn).parents("li:first").append("<ul>"+li+"</ul>");
        }else {
            $(btn).parent().next("ul").prepend(li);
        }
    }
});