web基础知识(一)关于ajax传值最基础东西
HTTP方法之 GET对比POST
GET:从指定的资源请求数据, POST:向指定的资源提交要被处理的数据
GET方法:
请注意,查询字符串(名称/值对)是在 GET 请求的 URL 中发送的:
/test/demo_form.asp?name1=value1&name2=value2
有关 GET 请求的其他一些注释:
-
- GET 请求可被缓存
- GET 请求保留在浏览器历史记录中
- GET 请求可被收藏为书签
- GET 请求不应在处理敏感数据时使用
- GET 请求有长度限制
- GET 请求只应当用于取回数据
POST方法:
相对应的,
1不会被缓存,2不会保留在浏览记录中,3不能收藏书签,4数据长度无限制。
例子:
$("button").click(function(){ $.post("demo_test_post.asp", { name:"Donald Duck", city:"Duckburg" }, function(data,status){ alert("Data: " + data + "\nStatus: " + status); }); });
可以发现POST是参数和请求一起发送到参数是(URL)请求是数据name和city
这个ASP代码如下
<% dim fname,city fname=Request.Form("name") city=Request.Form("city") Response.Write("Dear " & fname & ". ") Response.Write("Hope you live well in " & city & ".") %>
关于使用ajax向后台传值问题:jsp页面代码
用户名:<input type="text" name="user" id="user" /> 邮箱:<input type="text" id="email" name="email" /> <div id="showuser"></div> <input type="button" value="获取值" id="btnGet" onclick="getValue()" />
在js中,代码如下
function getValue(){ $.ajax({ type:"post", url:"loadUser.action", data:{ user:$('#user').val(), email:$('#email').val() }, success: function(response, status, xhr){ console.log(response); $('#showuser').html(response[0].content); } }); };
注意使用 user:$('#user').val(), 获得到值其中'#user',起作用的是id="user"而不是name="user"(试试即可知道)。如果后台Action的话可以直接在后台用相同的名称,使用getset方法即可得到值。
console.log(response),是让返回的值在浏览器的console中输出。
关于radio button和select集合如何在ajax js中获取相应的值
<input id="userSex" name="userSex" type="radio" value="男" checked="checked" /> 男 <input id="userSex" name="userSex" type="radio" value="女" /> 女 <input id="userSex" name="userSex" type="radio" value="保密" /> 保密 <s:select list="listNums " listValue="numName " listKey="numId" name="numId" id="numId" headerKey="ol" headerValue="请选择" value="bean.numId"></s:select>
下面js中是取值方法,都已经经过自己使用,(关于radio我觉得还挺复杂的,不知有人提供更简单的不)
var sex=document.getElementsByName("userSex");//不能getElementById,ById又只会读数组第一个值 var sexvalue; for(var i = 0; i < sex.length; i++) { if(sex[i].checked) sexvalue = sex[i].value; } //sexvalue就是所需要的值 var numId = document.getElementById('numId').value;//select选择框更加简单 这一句就OK了