1

我正在调用页面刷新后选择组件 ID 的函数：

$(document).ready(
  function() {
    document.getElementById('form:#{myBDE.componentId}').focus();
    document.getElementById('form:#{myBDE.componentId}').select();
  }
)

我的提交按钮示例：

<h:form id="form">
  <h:commandButton id="btnSubmit" action="#{myBDE.save}" type="submit" >
    <f:ajax execute="@form" render="@form"/>
  </h:commandButton>
  ...
</form>

每次单击任何提交按钮时，如何创建要调用的相同函数（我使用的是 ajax，所以我在不重新加载页面的情况下工作，document.ready 对我来说还不够）。可能吗？

更新（部分功能解决方案）：

var myFunc = function() {
  document.getElementById('form:#{myBDE.componentId}').focus();
  document.getElementById('form:#{myBDE.componentId}').select();
};

$(document).ready(function() {
  myFunc();
  $('input[type=submit]').click(myFunc);    
});

我可以调用添加onclick="return myFunc();"到的函数h:commandButton，问题是，<f:ajax>在调用函数后呈现表单，因此选择和焦点被清除:(

4

5 回答 5

2

为函数命名（目前，它是一个匿名函数），然后在需要时调用该函数。

$(document).ready(
  onPageLoad(); // call it when page loads    
  $('form').submit(onPageLoad); // also call whenever a form is submitted
)

function onPageLoad() {
    document.getElementById('form:#{myBDE.componentId}').focus();
    document.getElementById('form:#{myBDE.componentId}').select();
    return true;
}
于 2012-11-24T08:20:35.703 回答
1

您应该将处理程序委托给更高级别的 dom 元素：

$(document).ready(function() {
  $('h:body').on('click', 'input[type=submit]', function() {
    document.getElementById('form:#{myBDE.componentId}').focus();
    document.getElementById('form:#{myBDE.componentId}').select();
  });    
});

请参阅jQuery.on()。

当提供选择器时，事件处理程序被称为委托。当事件直接发生在绑定元素上时，不会调用处理程序，而只会调用与选择器匹配的后代（内部元素）。jQuery 将事件从事件目标冒泡到附加处理程序的元素（即，从最里面到最外面的元素），并为沿着该路径匹配选择器的任何元素运行处理程序。

然后后来：

委托事件的优点是它们可以处理来自以后添加到文档的后代元素的事件。通过选择在附加委托事件处理程序时保证存在的元素，您可以使用委托事件来避免频繁附加和删除事件处理程序的需要。

因此，该事件将针对该类型的所有元素进行处理，即使它们稍后通过 ajax 添加。请注意，我h:body在这里用作委托给的元素，但您可以使用在 document.ready 时存在的任何元素，并保证是所有提交输入的祖先。

于 2012-11-24T10:16:35.990 回答
1

这应该工作

$('input[type="submit"]').click(function(){ 
  document.getElementById('form:#{myBDE.componentId}').focus(); 
  document.getElementById('form:#{myBDE.componentId}').select();
 });

事实上，您可以将函数绑定到任何事件。在这种情况下，它是属性 type=submit 的输入标签的点击事件

于 2012-11-24T08:34:54.457 回答
0

如果您有不同的 ID 或姓名，那只是做类似的事情

$(document).ready(function(){
    $('#btn1, #btn2, #btn3').on('click', function(evt){
        evt.preventDefault();
        //your code
        $(this).submit(); // or not submit, your choice
    });
});
于 2012-11-24T08:19:55.577 回答
0

试试这个东西

 $(document).ready( function (){

           $('input[type=submit]').click( function (){
                  // Whatever you want on submit button click option.
           }
 });

这将抓取页面上的每个提交按钮并将点击事件绑定到它，并且此代码将在任何提交按钮点击时调用。

于 2012-11-24T08:37:28.913 回答