Home >Web Front-end >HTML Tutorial >Commonly used page submission methods_html/css_WEB-ITnose
This article will summarize the commonly used page submission methods.
When it comes to common uses, everyone should pay attention. If the method you choose is not commonly used, then you should think about your design or program. You still have to stand on the shoulders of giants to create good things.
Actually, the several methods I will talk about in this article are relatively common.
A common practice is to do the right thing at the right time. The right technology, used in the right place, is good design; it is like meeting the right person at the right time.
Method 1:
Common form submission.
Submit the page this way and the page will jump. In this method, you can choose the post submission method or the get submission method. Generally, the submission form is a universal post. This method is very commonly used.
var form = document.getElementById("frm01"); form.action ="<%=basePath %>test/productShow.action"; form.method = "post"; form.submit();
Method 2:
The splicing parameters are behind the url.
This method is the get submission method. The parameters will be listed after the url. This method is also the most commonly used, but pay attention to the confidentiality of the parameters passed and the length limit of the parameters.
window.location.href="<%=basePath%>test/productDetails.shtml?productId="+$("#productId").val() +"&detailUrl="+$("#detailUrl").val() ;
Method 3:
Ajax form submission method .
In this way, the entire frm01 will be submitted and partially refreshed. If you need to jump to a page, you can also jump to the page in the success function in combination with other page jump methods.
$.ajax({ type:'post', url: '<%=basePath %>test/productShow.shtml', data:$("#frm01").serialize(), dataType:'json', cache: false, success : function(data) {} });
Method 4:
Ajax splicing parameter submission.
This method is similar to the above method, but it is equivalent to splicing parameters after the url. Instead of submitting the entire form. Similarly, in this method, the page will not jump and will be partially refreshed.
$(".send_msg").click(function(){ $.ajax({ type:'post', async:true, url: "<%=basePath%>test/productShow.shtml", data:"product.productId="+$("#productId").val() +"&product.productName="+ $("#productName").val()+"&product.logo="+$("#logo").val(), dataType:'json', cache: false, success : function(data) {} });})
Method 5:
When multiple choices are made, submit.
$("#realBuy").bind("click",function(){ var ids=new Array(); var itemNos=new Array(); $(".payItemBox ul li").filter(".selected").each(function(index){ ids.push($(this).prev().prev().val()); itemNos.push($(this).prev().val()); }); $("input[name='theoryrepayids']").val(ids.join(",")); $("input[name='itemNos']").val(itemNos.join(",")); $("input[name='total']").val(sum.toFixed(2)); $("#repForm").submit(); });
Method 6:
After jumping to this page, submit automatically , and complete the jump.
This method is generally used when making payment jumps.
<form action="https://yintong.com.cn/llpayh5/authpay.htm" method="post" name="mainform" id="mainform"> <input type="hidden" name="req_data" value='${req_data}' /> </form> <script type="text/JavaScript"> mainform.submit(); </script>
Summary:
1. In order to avoid form trapping In the case of form, we can construct a newForm, assign the required parameters through js, and submit this newForm;
2. Some parameters are not suitable for passing between pages, such as a The amount of the order, the quantity purchased, etc., then I can transfer the important information, and then query the database [pay attention to data consistency issues], and analyze the specific issues in detail;
3. Suitable When using appropriate techniques, you will be able to do it with ease over time. Otherwise, we will go in the opposite direction and continue to accumulate failed experiences.