Question

应该很简单，但我无法解决。

我有一个带有表的页面，在该表中是一个自动完成和一个按钮，当我单击按钮并禁用或启用它时，我想找到自动完成。禁用/启用部分不是问题，我不能让它遍历heirarchy以找到自动完成的第一个位置。这是我得到的html块： -

<td colspan="3">
                    <fieldset class="buttons">
                    <div>
  <input class='required' style='width:400px' type='text' id='autoLook[0]' name='autoLook[0].id' value='' title='' />
  <div class='searchcontainer yui-skin-sam' id='abb890644f19d382ef69951344848d878'></div>
  <script type='text/javascript'>   var autoCompleteDataSource = new YAHOO.util.XHRDataSource("/FARTFramework/form/searchAJAX");
    autoCompleteDataSource.responseType = YAHOO.util.XHRDataSource.TYPE_XML;
    autoCompleteDataSource.responseSchema = {
 resultNode : "result", 
 fields : [
 { key: "name" }, 
 { key: "id" }
]
};
;
    autoComplete = new YAHOO.widget.AutoComplete('autoLook[0]','abb890644f19d382ef69951344848d878', autoCompleteDataSource);
    autoComplete.queryDelay = 0;
    autoComplete.prehighlightClassName = 'yui-ac-prehighlight';
    autoComplete.useShadow = false;
    autoComplete.minQueryLength = 3;
    autoComplete.typeAhead = false;
    autoComplete.forceSelection = true;
    autoComplete.maxResultsDisplayed = 20;
    autoComplete.shadow = false;
    var itemSelectHandler = function(sType, args) {
        var autoCompleteInstance = args[0];
        var selectedItem = args[1];
        var data = args[2];
        var id = data[1];
        updateHiddenInput(id, 0, 'forms')   };
    autoComplete.itemSelectEvent.subscribe(itemSelectHandler);
</script>
</div>

                        <input type="button" id="EnableDisable" value="Edit" onclick="enabledisable($(this))" />

                        <input type="hidden" class="required" id="forms[0]" name="forms[0].id" value="" />          
                        <input type="hidden" class="required" id="oldvalue[0]" name="oldvalue[0].id" value="" />
                        <input type="button" value="Remove Form" onclick="globalRemoveRow($(this),'forms')" />
                        <input type="button" value="Insert New Form Above" onclick="addRowWithin('/FARTFramework/testScenario/ajaxNewFormFragment',$(this))" />
                        <input type="button" value="Go to Form Definition" onclick="gotoNew('/FARTFramework/form/edit/',$(this))" />    
                    </fieldset>
                    <div id="hideDIV">
                        <table name="formSubTable[0]" id="formSubTable[0]">
                        </table>
                    </div>
                </td>

我点击的按钮名为“EnableDisable”，在javascript中我可以这样做： -

function enabledisable(theButton){
    $thebutton = $(theButton)
    $theInput = $thebutton.closest('td')
    var myValue = $theInput.html();
    alert(myValue)  
}

返回此内容： -

<fieldset class="buttons">
                    <div class="yui-ac">
  <input required="required" autocomplete="off" class="required yui-ac-input" style="width:400px" id="autoLook[0]" name="autoLook[0].id" value="" title="" type="text">
  <div class="searchcontainer yui-skin-sam yui-ac-container" id="af745a9597adf2dd98aeab126bc31bcb9"><div style="display: none;" class="yui-ac-content"><div style="display: none;" class="yui-ac-hd"></div><div class="yui-ac-bd"><ul><li style="display: none;"></li><li style="display: none;"></li><li style="display: none;"></li><li style="display: none;"></li><li style="display: none;"></li><li style="display: none;"></li><li style="display: none;"></li><li style="display: none;"></li><li style="display: none;"></li><li style="display: none;"></li></ul></div><div style="display: none;" class="yui-ac-ft"></div></div></div>
  <script type="text/javascript">   var autoCompleteDataSource = new YAHOO.util.XHRDataSource("/FARTFramework/form/searchAJAX");
    autoCompleteDataSource.responseType = YAHOO.util.XHRDataSource.TYPE_XML;
    autoCompleteDataSource.responseSchema = {
 resultNode : "result", 
 fields : [
 { key: "name" }, 
 { key: "id" }
]
};

我可以看到我想要的输入是第三行，第一行输入就是那个html。但是当我尝试将jquery扩展为$thebutton.closest('td').children('input').eq(0)时，我会返回undefined。

我已经尝试了各种方式的第一个，下一个等但没有运气。我知道输入中会有文本autolook [xx]但是会有负载带有该id，我不知道这个数字只是寻找一个特定的id或名称，所以需要遍历html到找到它......

Answer 1

尝试使用.find()

$thebutton.closest('td').find('input[type='text'])

或者

$thebutton.closest('td').find('input')

或者

$thebutton.closest('td').find('input:first')

Answer 2

尝试改变这个：

function enabledisable(theButton){
    $thebutton = $(theButton)
    $theInput = $thebutton.closest('td')
    var myValue = $theInput.html();
    alert(myValue)  
}

到此：

$('#EnableDisable').click(function(){
    var myValue = $(this).closest('td').find('input').val();
    alert(myValue)  
});

和你的html改变：

<input type="button" id="EnableDisable" value="Edit"  />

无法找出jQuery find在层次结构中找到对象

2 个答案: