我是 JavaScript 新手。我需要帮助来修改这个脚本。我希望当我单击表格行时使用按钮的唯一 ID 调用下面的按钮。
$(document).ready(function(){
$(selector).click(); //selector = h:commandLink
});
$(selector).find('tr').each(function(){ //selector = h:dataTable
$(this).click(function(){
$(selector).trigger('click'); //selector = h:commandLink
});
});
<h:commandLink id="lnkHidden" action="#{bean.pageRedirect}" style="text-decoration:none; color:white; display:none">
</h:commandLink>
你能帮我解决这个问题吗?
附言 这是表格的代码:
<h:form id="form" >
<!-- The sortable data table -->
<h:dataTable id="dataTable" headerClass="columnHeader" value="#{bean.dataList}" binding="#{table}" var="item">
<!-- Check box -->
<h:column>
<f:facet name="header">
<h:selectBooleanCheckbox style="margin-left: 0px;" value="#{bean.value}" class="checkall" >
<f:ajax listener="#{bean.value}" render="@form" />
</h:selectBooleanCheckbox>
</f:facet>
<h:selectBooleanCheckbox onclick="highlight(this);" value="#{bean.value" >
<!-- if the user deselects one row deselect the main checkbox -->
<f:ajax listener="#{bean.deselectMain}" render="@form" />
</h:selectBooleanCheckbox>
<!-- Click on table code -->
<h:commandLink id="lnkHidden" action="#{bean.pageRedirect}" style="text-decoration:none; color:white; display:none">
</h:commandLink>
</h:column>
<!-- Row number -->
<h:column>
<f:facet name="header">
<h:outputText value="№" />
</f:facet>
<h:outputText value="#{bean.value}" />
</h:column>
..........
</h:dataTable>
这是生成到网络浏览器中的部分代码:
<tr class="">
<td>
<input id="form:dataTable:1:j_idt17" type="checkbox" onclick="jsf.util.chain(this,event,'highlight(this);','mojarra.ab(this,event,\'valueChange\',0,\'@form\')')" name="form:dataTable:1:j_idt17">
<a id="form:dataTable:1:lnkHidden" onclick="mojarra.jsfcljs(document.getElementById('form'),{'form:dataTable:1:lnkHidden':'form:dataTable:1:lnkHidden'},'');return false" style="text-decoration:none; color:white; display:none" href="#"></a>
</td>
<td>2</td>
<td>35435</td>
最佳答案
如果您使用 JSP(或任何语言),id
属性是您想要用于定位元素的内容,但它有点棘手,因为它以复杂的方式生成它们。
由于您需要处理表格行的点击,您可以绑定(bind)事件并触发 click
像这样的事件:
$('table[id$="dataTable"]').find("tbody").on("click", "tr", function () {
$(this).find('a[id$="lnkHidden"]').trigger("click");
});
这需要在 $(document).ready
内处理程序也是如此。
这将绑定(bind)一个 click
<table>
的事件处理程序.当 <tr>
单击,此处理程序运行,并且 this
指的是特定的行。这样,我找到了 <a>
(linkButton) 包含在该行中,具有特定的 id
你的目标,并触发它的 click
事件。
我找到 linkButton 的方法是使用“属性”([name]
)和“结尾为”($=
)选择器。所有生成的元素都有一个 id
以原始 id
结尾设置(更多信息,内部使用,在 id
的开头)...这就是引擎生成它们的方式。
我不确定您在 document.ready
中尝试做什么处理程序,但如果需要触发 click
我们针对的所有 commandLink 的事件,您可以使用:
$('a[id$="lnkHidden"]').trigger("click");
所以我最终使用的代码是:
$(document).ready(function () {
$('table[id$="dataTable"]').find("tbody").on("click", "tr", function () {
$(this).find('a[id$="lnkHidden"]').trigger("click");
}).on("click", 'a[id$="lnkHidden"]', function (e) {
e.stopPropagation();
});
});
关于javascript - 来自 JavaScript 的调用按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15887002/