为什么 ui.item.attr("id") 返回未定义的值？答案

【问题标题】：why ui.item.attr("id") return undefined value?为什么 ui.item.attr("id") 返回未定义的值？
【发布时间】：2013-05-28 08:42:24
【问题描述】：

我正在使用<li> 和<ul> 之间的可排序，但是当我尝试获取ui.item.attr("id") 时，我得到了未定义但其他变量运行良好，例如$(this).attr('id') 和'+ui.sender.attr('id')，但我正在搜索索引<ul> 拖动元素的位置。

我的 js 文件：

 $( init );
      function init() {

            $(".list-items").sortable({
                 connectWith: '.list-items',
                 items: "li:not(.item.new)",
                 placeholder: 'place-holder',
                 scroll: false,
                 tolerance: "pointer",update: function (event, ui) {
                 //alert($(this));
            }, 
            receive : function(e, ui) { 
                 alert('zone : '+ ui.item.attr("id"));            

                 alert('Where the item is dropped : '+$(this).attr('id')); // Where the item is dropped
                 alert('from where the item is dragged : '+ui.sender.attr('id')); // from where the item is dragged

                 if(ui.item.text()=="51173115") {

                      jConfirm('item '+ui.item.context.id+' capacite Cuisson epuise vous voulez continue comme meme ?', 'alerte', function(r) {     
                  if(r)           
                  {

                  }
                  else
                  {
                       $(ui.sender).sortable('cancel'); // refuse element to be dropped
                  }
           }
      }

 }).disableSelection();

        }

我的 jsf 代码：

<div class="gauchedragdrop"> 

        <p class="ui-widget-header" style="margin:0;padding:5px;color: #2779bb;">tableof</p>
          <ul id="ulgauche" class="list-items ui-sortable " > 
            <ui:repeat value="#{gestionduplanning.listzp01Equipe}" var="vari" >
                    <li class="item"><a  title="#{vari.ordre.toString()}">#{vari.ordre.toString()}</a></li>
            </ui:repeat>            
          </ul>    
</div> 
<div class="droitedragdrop">

            <p:dataTable var="op" value="#{ gestionduplanning.EQlistoneequipe.get(0).listop}" style="width: 700px;float: left;">

                <p:column headerText ="les of" style="width:550px;"> 
                       <ul id="uldroite" class="list-items ui-sortable">  
                        <ui:repeat value="#{op.orderedOf}" var="vari" >  
                            <li class="item"  ><a  title="#{vari}">#{vari}</a></li>
                        </ui:repeat>                        
                        </ul> 
                </p:column>
               </p:dataTable>

        </div>

为什么我得到未定义的值，我怎样才能得到这个值？

【问题讨论】：

你不能像上面的代码那样使用ui.item.context.id吗？
我对此一无所知
当 ul 动态创建并具有相同的 id 时，每个 UL 之间的区别是什么

标签： jquery jsf

【解决方案1】：

问题在于ui.item是对象的集合，所以需要使用ui.item.context.id来获取被拖动元素的id，在jQuery Sortable documentation中指定：

ui.item

类型：jQuery

代表当前拖动元素的jQuery对象

所以您的案例ui.item 将是被拖动的<li>，因为它们没有设置id 属性ui.item.context.id 将始终为空。

如果您在li 上设置了一个ID，那么您可以访问它：http://jsfiddle.net/qj4GG/2/

您到底想获得什么属性？你需要它做什么？

【讨论】：

这已经过时了。使用ui.item.attr('id') 获取ID。

【解决方案2】：

你可以试试 ui.item.option.childNodes[0].parentNode.parentNode.attributes[2].value

只需将 attributes[] 索引值更改为按照 id 的顺序。这里我在id之前有两个属性。

this._on( this.input, {
      autocompleteselect: function( event, ui ) {
        ui.item.option.selected = true;
        alert(ui.item.option.childNodes[0].parentNode.parentNode.attributes[2].value);
        this._trigger( "select", event, {
          item: ui.item.option
        });
      },

【讨论】：