jQuery：输入值在keyup上丢失？

我有一个简单的表单，当用户在输入字段上按下回车键时，我想提交一个简单的表单（即火ajax）。如果我按提交按钮，事件触发正常，但是当使用键控来触发完全相同的功能时，输入字段的值为空。我尝试使用$（this）.val（）传递输入字段的值（来自keyup函数），但传递的参数仍为空。jQuery：输入值在keyup上丢失？

更新II：该问题仅出现在初始加载时。点击刷新后，事件根据预期开火。经过Chrome和FF测试。

http://jsfiddle.net/R5QsC/1/

// Value of #pin is blank in getKeyAjax() 
$('#pin').keyup(function(e) { 
    if (e.keyCode == 13) { 
     console.log('DEBUG: Keypress detected (13)') 
     getKeyAjax(); 
    } 
}); 
// Value of #pin is correct in getKeyAjax() 
$('#btnPwdCreate').click(function() { 
    getKeyAjax(); 
}); 

function getKeyAjax() { 
    console.log('DEBUG: Starting ... getKeyAjax()'); 
    var txtPin = $('#pin').val(); 
    console.log('DEBUG: Value of txtPin: ' + txtPin); 
    . 
    . 
    . 
}

来源

2012-07-15 KG Christensen

它似乎在这里正常工作，对不对？（http://jsfiddle.net/swz5c/） – Abraham 2012-07-15 13:43:21

我忘了提及它确实有效，但有时只是（通常不）。这反过来又使得解决问题变得更加困难。尽管如此，我只在Chrome和FF中进行过测试。 – 2012-07-15 13:45:05

嗯，你可以在jsfiddle.net上用你的HTML和JS设置一个小提琴吗？ – Abraham 2012-07-15 13:51:14

我注意到您的小提琴一两件事，可能会导致此。在使用表单字段时，我注意到有时候我收到了一个警告，说明'只有4位数'，通常我没有。问题在于你的标签form。敲入enter触发浏览器的默认行为：非Ajax表单提交。如果在你的$.GET运行之前这样做了，那么它与你所描述的行为一致，在刷新js被缓存之后，然后可以在提交和刷新发生之前更快地评估$ .get。它只是一个理论，但最终它留给你两种选择：

从您的html中删除<form>标记。
$('form').on('submit', function(e){e.preventDefault();});

1＃将有没有默认提交了效果，因为没有<form>这样做。 2＃覆盖onsubmit事件以防止默认提交（让您保留表单标记）。

无论这是否解决了您所遇到的问题，无论您的脚本如何，您都需要它。它将是在表单中输入输入时执行ajax的关键。上述

http://jsfiddle.net/9TYhT/

小提琴。行为现在是一致的。

来源

2012-07-15 15:41:39 Fresheyeball

优秀 - 很好的回复和解释。我采用了＃2建议，现在适用于所有目标浏览器。 – 2012-07-15 16:11:43

试试这个：

$(document).ready(function(){ // make sure DOM is ready to be manipulated 
    // ... 

    $('#pin').keyup(function(e) { 
     if (e.which == 13) { 
      getKeyAjax(); 
      e.preventDefault() // prevents form from being submitted 
     } 
    }); 

    // ... 
})

来源

2012-07-15 13:44:02 undefined

@KGChristensen在DOM准备好被操纵之后，是否使用'$（document）.ready（）'？ – undefined 2012-07-15 13:50:14

我已经尝试了两个（只是为了它的地狱），目前它驻留在doc.ready中。小更新：似乎现在在Chrome中工作（在添加了Raminson的建议并强制清理Tomcat之后...）。尽管在Firefox中没有运气。 – 2012-07-15 14:01:04

上面划伤。查看更新的第一篇文章。 – 2012-07-15 15:30:15

jQuery：输入值在keyup上丢失？

回答

相关问题