關於ajax提交表單
阿新 • • 發佈:2017-07-25
send tap sent when lose child you photo oca
今天主要是四個問題:
1.表單頁面元素的獲取;
2.按鈕的值的獲取;
3.按鈕的值以變量提交;
4.表單的提交;
- 獲取表單元素時用的是事件委托的方法。{犯的錯誤:1、用獲取表格父級元素的方法獲取,沒有意識到表單的值是填在value裏面的,而表格裏面的值直接在th容器裏填的 2、在考慮父級元素時沒有考慮到它所有的容器都屬於他的父級元素 3、在獲取子元素時,沒有意識到childnode是一個數組,當子元素含有多個子級時,每一個子級都有一級對應childnode[?]
- 獲取按鈕的值的代碼,首先每個按鈕都有自己對應的value,將從後臺獲得的值附給對應的按鈕是它處於選中狀態。
var radiovar = document.getElementsByName("sex"); if (radiovar[0].value=== node.childNodes[2].innerHTML ) { radiovar[0].checked="checked"; } if (radiovar[1].value===node.childNodes[2].innerHTML ) { radiovar[
3.然後將表單上的值取出來,又傳給後端。
var scct =‘‘; if(node.childNodes[2].childNodes[0].childNodes[0].checked===true){ scct=‘M‘; } else if(node.childNodes[2].childNodes[0].childNodes[0].checked===false){ scct=‘F‘; }
4.表單的提交,開始用的是
this.location = "../requests/myPhotographers/dropPhotographer.php?account=" + act + "";
的方法,發現判斷它返回值的函數不能使用,是因為此方法會使頁面跳轉,所以使用ajax提交表單的方法提交
if (fcStart === 0) { $(‘#usemf‘).on(‘submit‘, function (e) { // document.getElementById("aaa").innerHTML = ‘aaaaa‘;//when form submit // alert(‘submit!‘); e.preventDefault(); //prevent it being sent var details = $(‘#usemf‘).serialize(); //serialize from data }); var uem = new XMLHttpRequest(); uem.onload = function() { if (uem.status === 200) { var newLoad = ""; // var returnDataP = "error:Authentication Failed For RDS maybe username or password is incorrect"; // var returnDataA = "error:Access denied for user [email protected] (using password: YES)"; // var returnDataN = "error:user not exist"; //定義匹配信息 var patt1=new RegExp("error:You do not have permission to modify the photographer!"); var patt2=new RegExp("The modification is successful!"); if (patt1.test(uem.responseText)){ //如果返回數據為error。。,則彈出沒有權限 newLoad = "<div class=\"alert alert-block\" > <button type=\"button\" class=\"close\" data-dismiss=\"alert\">×</button> <h2>sorry!</h2> <h4>您沒有修改權限!</h4></div>"; setTimeout(dute,500) } if (patt2.test(uem.responseText)){ //如果返回數據包含successful,則彈出修改成功 newLoad = "<div class=\"alert alert-success\" > <button type=\"button\" class=\"close\" data-dismiss=\"alert\">×</button> <h2>congratulation!</h2> <h4>修改攝影師成功!</h4></div>"; setTimeout(dute,500) } } document.getElementById("usemf").innerHTML = newLoad; }; uem.open("get", "../requests/myPhotographers/modifyPhotographer2.php?account="+ncct+"&name="+acct+"&sex="+scct+ "" +"&phoneNumber="+pcct+"&email="+ecct+"", true); uem.send(); }
此方法不僅可以阻止頁面跳轉,還可以將數據以get的方式發送。
關於ajax提交表單