简体   繁体   English

使用jQuery模糊功能从输入字段返回值

[英]Return value from input field with the jQuery blur function

Goal: User focuses input field. 目标:用户关注输入字段。 User writes a value in input field. 用户在输入字段中写入一个值。 When user is done and the input field isn't in focus anymore, save inserted value to a variable called 'inputFieldValue'. 当用户完成操作并且输入字段不再是焦点时,将插入的值保存到名为“ inputFieldValue”的变量中。 This is should be done invoking the function 'returnInputValue'. 这应该通过调用函数“ returnInputValue”来完成。

html HTML

<!DOCTYPE html>
<html>
    <head>
        <title>My test</title>  
    </head>
    <body>

        <input class="input" />

        <script type="text/javascript" src="jquery.min.js"></script>
        <script type="text/javascript" src="test.js"></script>

    </body>
</html>

test.js test.js

function returnInputValue() {

    var inputValue;

    $('.input').blur(function() {   

        inputValue = $('.input').val();

    });

    return inputValue;

}

var inputFieldValue = returnInputValue();

When I call the variable inputFieldValue variable from the console after having inserted a value and focused out again, it is still 'undefined'. 当我在插入值并再次聚焦之后从控制台调用变量inputFieldValue变量时,它仍然是“未定义”的。

Have I missed something? 我错过了什么吗?

The function you execute is an asynchronous function, ie, it is based on the time after the input triggers a blur event. 您执行的函数是一个异步函数,即,它基于input触发blur事件之后的时间。 You need to either return it inside the blur event: 您需要在blur事件中将其返回:

function returnInputValue() {
    var inputValue;
    $('.input').blur(function() {   
        inputValue = $('.input').val();
        return inputValue;
    });
}

As suggested by some, even above code is not correct. 正如某些人所建议的那样,即使上面的代码也不正确。 The inputValue doesn't work as it always returns undefined . inputValue无效,因为它总是返回undefined

Or, set it up to directly access the last blur red value. 或者,将其设置为直接访问上一个blur红色值。

var inputValue = "Not Blurred Yet!";
$('.input').blur(function() {   
    inputValue = $('.input').val();
});

function returnInputValue() {
    return inputValue;
}

Try to declare variable outside the function 尝试在函数外声明变量

    <script>
       var inputValue;
        function returnInputValue() {

        $('.input').blur(function() {   

            inputValue = $('.input').val();

        });

        return inputValue;
   }
    var inputFieldValue = returnInputValue();
    </script>

This is the current logic: 这是当前的逻辑:

  1. Initialize a variable that has an undefined value. 初始化具有undefined值的变量。
  2. Bind a handler which is executed at undefined junctures, the variable is still undefined . 绑定在未定义的时刻执行的处理程序,该变量仍然是undefined
  3. Return the undefined value immediately 立即返回undefined

The above logic is broken and should be rectified. 上述逻辑已损坏,应予以纠正。 The best option is moving the final logic into the blur handler: 最好的选择是将最终逻辑移入blur处理程序:

 $('.input').blur(function() {   
    var inputValue = this.value;
    // do something with the value
    // ...
 });

If you need to get the value at a certain juncture, query the DOM, select the element and get it's value. 如果需要在某个特定时刻获取值,请查询DOM,选择元素并获取其值。

You could use. 您可以使用。

$(document).on("blur","#Yourinput",function(){
   var Myval = $("#Yourinput").val();
   // Execute your code here I.e call your function 
   // ...
// You do not even have to call you function put
// It in a div to display 
$("#yourdiv").html(Myval);
//Will display it in a div
//Or add to array
Yourarray.push(Myval);
});

This uses jQuery .on() method. 这使用jQuery .on()方法。

This method is very flexible. 此方法非常灵活。 If your inserting into a database you can do that here too quite simply with jquery ajax. 如果您要插入数据库,则可以使用jquery ajax在这里非常简单地进行操作。

You have to play with the events Ie replace blur with another event but if your using jquery this I believe is the simplest method 您必须处理事件,即用另一个事件替换模糊,但是如果您使用jquery,我相信这是最简单的方法

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM