JQ的.val()获取不到用户输入值的特殊情况处理
作者：秋了秋 发表时间：2015年05月03日
在学习js和jq，无意今天翻看自己网站的js，发现还有一个问题没解决，就是采取ajax后搜索路径不对的，一直都是显示一个错误的地址，因为自己在本站搜索用得少，也没有造成js错误，只是对不上号而已也就没理了。这也算是一个比较奇葩的问题吧，可能就只有我一个人遇到~，在一个带有默认值的input输入框中，
<input name="s" class="s" type="text" onblur="if (this.value =='') this.value='我是初始值'" onfocus="this.value=''" onclick="if (this.value=='我是初始值') this.value=''" value="我是初始值"> <input id='button1' type='button' value='弹出'> <input id='button2' type='button' value='写入'>
我试图用jq把输入框的值提取出来，我用了alert来查看，当我输入内容后，即改变了默认的初始值，再点击alert，没问题，能正确弹出我输入的内容。可是当我试图用$("输入框的class").val()来充当地址栏里面的变量的时候，地址栏的变量并不会变，一如既往地显示输入框的初始值，用alert($("输入框的class").val())和document.write($("输入框的class").val())这两种方法输出的值都是输入后的值。例如我输入“这是用户输入的值”
$('#button1').click(function(){ alert($("#s").val());})//能正确弹出“这是用户输入的值”
$('#button2').click(function(){document.write($("输入框的ID").val());})//能正确输出“这是用户输入的值”
$(".s").each(function(index) {
if ($(this).attr("action")) {
document.URL ='//netblog.cn?s=' + $(".s").val() + '&ok=搜索';
}});//地址栏输出的地址为//netblog.cn/?s=我是初始值&ok=搜索，失败获取！！！
百思不得其解，刚好看到一个jq监听事件.change()才略微有点思路，把这个加上去之后果然就可以正确取到输入后的值，即是下面的代码：
$(".s").each(function(index) {
if ($(this).attr("action")) {
$(".s").change(function () {
document.URL ='//netblog.cn?s=' + $(".s").val() + '&ok=搜索';
}});});//地址栏输出的地址为//netblog.cn/?s=这是用户输入的值&ok=搜索，获取成功！！！
但是至于为何直接用$(".s").val()的alert和document.write能正确提取到用户输入的值而给地址栏赋值却失败其实是因为没弄清js的执行顺序，alert和document.write我用了点击事件，当我在输入框输入内容后，再点击按钮让$(".s").val()的值alert和document.write出来，这完全没有问题的，因为它获取的是点击之后输入框里面的值，也就是已经改变了的值，而直接通过赋值的话是取的原始值，加个.change(),也就相当于加了个事件，每改变一次值就会触发赋值，所以取的都是最后改变的值而不是初始值。
所以每每取输入框的值的时候一定要放在事件函数里面，这样才能取得最新的值。