Home  >  Article  >  Web Front-end  >  In this case, as long as you enter content in the text box, it will be automatically submitted to ajax. How can you click the submit button to submit? _html/css_WEB-ITnose

In this case, as long as you enter content in the text box, it will be automatically submitted to ajax. How can you click the submit button to submit? _html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 12:23:121680browse

a4af873a37bdc4491a2626923f3f532f
42a13bf3ee253395dec168d879b4462a
90000cb9211b063c1e094a7735096b97

f5a47148e367a6035fd7a2faa965022e

In this case, as long as you enter content in the text box, it will be automatically submitted to ajax. How can I click submit? button to submit.


Reply to discussion (solution)

<form ><input type="text" name="cu" id="cu" /><input type="submit" name="Submit" value="提交" onSubmit="showCustomer(document.getElementById('cu').value)" /></form>

<form ><input type="text" name="cu" id="cu" /><input type="submit" name="Submit" value="提交" onSubmit="showCustomer(document.getElementById('cu').value)" /></form>


It doesn’t seem right for you to be like this, bro. . .

<form ><input type="text" name="cu" id="cu" /><input type="submit" name="Submit" value="提交" onSubmit="showCustomer(document.getElementById('cu').value)" /></form>


test.html?cu=&Submit=�ύ
After you submitted like this, the browser actually brought out the parameters at the end. I thought Submit via ajax without refreshing the page to display data?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title></head><body><form name="form1"><input type="text" name="cu" id="cu" /><input type="submit" name="Submit" value="提交" onclick="return showCustomer(document.getElementById('cu').value)" /> </form><script type="text/javascript">function showCustomer(e){	alert(e);		return false;}</script></body></html>

Sorry, the input element does not have an onsubmit event. In alert(e), where to write your ajax code

Sorry, the input element does not have an onsubmit event. .In alert(e), where to write your ajax code

You are so kind, I will give it a try, thank you.





Sorry, the input element does not have an onsubmit event. In alert(e), where to write your ajax code

You are too polite, I'll give it a try, thanks.

Replace the js file with mine. . I still know how to test.html?cu=&Submit=�ύ

Please post what you wrote

<form><input type="text" name="customers" id="customers" /><input type="submit" name="Submit" value="提交" onClick="return showCustomer(document.getElementById('customers').value)" /> </form><script type="text/javascript">var xmlHttpfunction showCustomer(str){ xmlHttp=GetXmlHttpObject();if (xmlHttp==null)  {  alert ("您的浏览器不支持AJAX!");  return;  } var url="getcustomer.php";url=url+"?q="+str;url=url+"&sid="+Math.random();xmlHttp.onreadystatechange=stateChanged;xmlHttp.open("GET",url,true);xmlHttp.send(null);}function stateChanged(){ if (xmlHttp.readyState==4){ document.getElementById("txtHint").innerHTML=xmlHttp.responseText;}}function GetXmlHttpObject(){var xmlHttp=null;try  {  // Firefox, Opera 8.0+, Safari  xmlHttp=new XMLHttpRequest();  }catch (e)  {  // Internet Explorer  try    {    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");    }  catch (e)    {    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");    }  }return xmlHttp;</script><p><div id="txtHint"><b>客户信息将在此处列出。</b></div></p>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title></head><body><form><input type="text" name="customers" id="customers" /><input type="submit" name="Submit" value="提交" onClick="return showCustomer(document.getElementById('customers').value)" /> </form><script type="text/javascript">var xmlHttpfunction showCustomer(str){ 	xmlHttp=GetXmlHttpObject();	if (xmlHttp==null){		alert ("您的浏览器不支持AJAX!");  		return false;  	} 	var url="getcustomer.php";	url=url+"?q="+str;	url=url+"&sid="+Math.random();	xmlHttp.onreadystatechange=stateChanged;	xmlHttp.open("GET",url,true);	xmlHttp.send(null);	return false;}function stateChanged(){ 	if (xmlHttp.readyState==4){ 		document.getElementById("txtHint").innerHTML=xmlHttp.responseText;	}}function GetXmlHttpObject(){	var xmlHttp=null;	try{  		// Firefox, Opera 8.0+, Safari  		xmlHttp=new XMLHttpRequest();  	}catch (e)  {		// Internet Explorer  		try{    		xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");    	}catch (e){    		xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");    	}  	}	return xmlHttp;}</script><p><div id="txtHint"><b>客户信息将在此处列出。</b></div></p></body></html>


Try it

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title></head><body><form><input type="text" name="customers" id="customers" /><input type="submit" name="Submit" value="提交" onClick="return showCustomer(document.getElementById('customers').value)" /> </form><script type="text/javascript">var xmlHttpfunction showCustomer(str){ 	xmlHttp=GetXmlHttpObject();	if (xmlHttp==null){		alert ("您的浏览器不支持AJAX!");  		return false;  	} 	var url="getcustomer.php";	url=url+"?q="+str;	url=url+"&sid="+Math.random();	xmlHttp.onreadystatechange=stateChanged;	xmlHttp.open("GET",url,true);	xmlHttp.send(null);	return false;}function stateChanged(){ 	if (xmlHttp.readyState==4){ 		document.getElementById("txtHint").innerHTML=xmlHttp.responseText;	}}function GetXmlHttpObject(){	var xmlHttp=null;	try{  		// Firefox, Opera 8.0+, Safari  		xmlHttp=new XMLHttpRequest();  	}catch (e)  {		// Internet Explorer  		try{    		xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");    	}catch (e){    		xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");    	}  	}	return xmlHttp;}</script><p><div id="txtHint"><b>客户信息将在此处列出。</b></div></p></body></html>


Try it
Master, that’s it. Thanks.

Master, please read this post of mine. .
http://bbs.csdn.net/topics/390542913

<form><input type="text" name="customers" id="customers" /><input type="submit" name="Submit" value="提交" onClick="return showCustomer(document.getElementById('customers').value)" /> </form><script type="text/javascript">var xmlHttpfunction showCustomer(str){ xmlHttp=GetXmlHttpObject();if (xmlHttp==null)  {  alert ("您的浏览器不支持AJAX!");  return;  } var url="getcustomer.php";url=url+"?q="+str;url=url+"&sid="+Math.random();xmlHttp.onreadystatechange=stateChanged;xmlHttp.open("GET",url,true);xmlHttp.send(null);}function stateChanged(){ if (xmlHttp.readyState==4){ document.getElementById("txtHint").innerHTML=xmlHttp.responseText;}}function GetXmlHttpObject(){var xmlHttp=null;try  {  // Firefox, Opera 8.0+, Safari  xmlHttp=new XMLHttpRequest();  }catch (e)  {  // Internet Explorer  try    {    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");    }  catch (e)    {    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");    }  }return xmlHttp;</script><p><div id="txtHint"><b>客户信息将在此处列出。</b></div></p>

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn