Jquery val()内部自定义函数

jquery val() inside custom function

本文关键字:内部 自定义函数 val Jquery      更新时间:2023-09-26

我有一个这样的函数在我的外部javascript文件(jQuery已经包含在主html文件):

function userlogin(){
    $('#ologinbox').html('<div class="input"><div class="input-text"></div><div class="input-field"><img src="css/images/loading.gif" /></div></div>');
    var data = 'username=' + $('#loginusername').val() + '&password=' + $('#loginpassword').val();
    alert(data);
}

和我的HTML是这样的:

<div class="input">
<div class="input-text">UserName: <div>
<div class="input-field"><input name="loginusername" id="loginusername" /></div>
</div>
<div class="input">
<div class="input-text">Password: </div>
<div class="input-field"><input name="loginpassword" id="loginpassword" type="password" /></div>
</div>
<div class="input">
<div class="input-text"></div>
<div class="input-field"><input type="submit" value="Send" onclick="userlogin();return false;"/></div>
</div>

当我点击按钮时,警告框中显示的$('#loginusername').val()$('#loginpassword').val()的返回值为未定义。

我想知道为什么??

$('#ologinbox').html('<div class="input"><div class="input-text"></div><div class="input-field"><img src="css/images/loading.gif" /></div></div>');
var data = 'username=' + $('#loginusername').val() + '&password=' + $('#loginpassword').val();

假设您发布的登录框是id为ologinboxdiv的一部分,您只是替换了其内容,因此丢失了元素#loginusername#loginpassword

在检索值后替换内容:

var data = 'username=' + $('#loginusername').val() + '&password=' + $('#loginpassword').val();
$('#ologinbox').html('<div class="input"><div class="input-text"></div><div class="input-field"><img src="css/images/loading.gif" /></div></div>');

(注意您的原始代码片段没有包含周围的<div id="ologinbox">,这将使这一点变得清楚!请在将来将您的测试案例放入jsfiddle.net以验证是否再现了问题,否则我们只是猜测。)

使用jQuery来处理点击事件。不确定为什么没有得到空字符串。要解决这个问题,可以分配属性并考虑使用jQuery来处理事件。

<script type='text/javascript'>
    $(document).ready(function(){
        $("#button").click(Foo);
        function Foo(){
           var myVar = $("#someInput").val();
           alert(myVar);
           return false;
        }
    });
</script>

<input id="someInput" value=""/>
<input  type="submit" />

试试:http://jsfiddle.net/pvQGs/

<input id="someInput" />
<input id="submitter" type="submit" />
$("#submitter").click(function() {
    var myVar = $('#someInput').val();
    alert(myVar);
    return false;
});

我在jsfiddle中尝试了这个,并且它正确地工作:http://jsfiddle.net/9gDas/。您是否在提交按钮上绑定了另一个事件,或者您可以发布更多代码?在jsfiddle我用的是jQuery 1.5.2,你用的是哪个版本?

编辑:您可以在这里看到:http://jsfiddle.net/r4QG3/您提供的代码可以正常工作。我不能测试ajax后。这段代码出了什么问题?