Question

如果他们点击按钮我想让我的功能可供用户使用，但如果他们按下也是如此。这是一个例子：

＆＃13;

$('#searchBtn').on('click', function searchUser(){
    $.ajax({
      type: 'POST',
      url: 'Components/Application.cfc?method=findUser',
      data: {'searchFldVal':searchFldVal},
        dataType: 'json'
    }).done(function(obj){
        return true;
      }else{
        return false;
      }
        });

        return false;
      }
    }).fail(function(jqXHR, textStatus, errorThrown){
      alert(errorThrown);
    });
  }
});

＆＃13;

<form name="searchForm" id="searchForm" action="#" method="POST" onsubmit="searchUser()">
	<div>
		<input type="text" name="searchFld" id="searchFld" size="24" maxlength="24" value="" title="Maximum size of the field is 24 characters." placeholder="Example: John, Miller" />
	</div>
	<div>
		<input type="button" name="searchBtn" id="searchBtn" value="Search"/>
	</div>
</form>

＆＃13;

如果我点击按钮上面的代码工作正常，但如果我输入几个字母并按回车，我的页面将重新加载。此文件保存为.cfm文件。我想在searchUser()和onClick上运行onKeypress功能。如果有人知道如何实现这一点，请告诉我。

Answer 1

由于您使用的是jQuery，因此请勿使用内联事件处理程序。定义函数并在提交表单时调用它，如下所示：

＆＃13;

function searchUser(e) {
  e.preventDefault();
  alert ("Do your ajax here instead of alert...");
}

$("#searchForm").on("submit", searchUser);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form name="searchForm" id="searchForm" action="#" method="POST">
	<div>
		<input type="text" name="searchFld" id="searchFld" size="24" maxlength="24" value="" title="Maximum size of the field is 24 characters." placeholder="Example: John, Miller" />
	</div>
	<div>
		<input type="submit" name="searchBtn" id="searchBtn" value="Search"/>
	</div>
</form>

＆＃13;

注意：

从表单
中删除了内联事件处理程序
更改按钮类型以提交。

Answer 2

如果您使用AJAX与服务器通信，则可能希望完全退出表单，操作和提交回调。这将导致页面重新加载的默认提交行为。相反，将一个监听器附加到搜索字段本身，该监听器将按下回车键。

$('#searchBtn').on('click', searchUser);

$('#searchFld').on('keypress', function(e){
    e.preventDefault();
    if(e.code == 'Enter'){
         searchUser();
    }
}); 


function searchUser(){
    // search for the user
}

在onClick和onKeypress JQuery / Javascript上提供函数吗？

2 个答案: