获取wordpress中输入字段的实时值

Get live value of input field in wordpress

本文关键字：实时 字段 输入 wordpress 获取      更新时间：2023-09-26

我试图设置一个变量到当前文本在一个输入框在"编辑后"屏幕在wordpress使用一个函数

我现在有:

jQuery(document).on("change, keyup, click", "#input_box_1, #input_box_2, #input_box_3", functionName);
    function functionName(){
        var myvar = parseFloat(jQuery("#input_box").val());
    var myvar2 = parseFloat(jQuery("#input_box_2").val());
    var myvar3 = parseFloat(jQuery("#input_box_3").val());
      }
    });

这当然只在你保存草稿两次时有效(当你第一次输入一个值时，输入框的html值不会改变，直到你保存它，然后当你再次保存它时，它将变量设置为新值)。

是否有一种方法来设置变量，以更新每次用户键入任何东西(使用，更改，keyup和点击)在输入框使用我的方法?

肯定有!

我为你创建了这个小提琴:

http://jsfiddle.net/7HQ4W/

<p>Original Input Value:
    <br />
    <input type="text" id="origVal">
</p>
<p>Target Input Value:
    <br />
    <input type="text" id="tarVal">
</p>
$('#origVal').keyup(function () {
    $('#tarVal').val($(this).val());
});

[基于注释的更新]

http://jsfiddle.net/7HQ4W/1/

我根据您的新代码示例为您调整了它。看起来怎么样?

$('#input_box_1, #input_box_2, #input_box_3').keyup(function () {
    var myVar1 = $('#input_box_1').val();
    var myVar2 = $('#input_box_2').val();
    var myVar3 = $('#input_box_3').val();
    $('#display').html("<p>myVar1 = " + myVar1 +
        "<p>myVar2 = " + myVar2 +
        "<p>myVar3 = " + myVar3);
});

必须绑定到输入框，以便在用户输入字符时更新变量:
Js: 

$('#input_box').on('keyup', function() {
    var my_value = $(this).val();
    $('#result').html(my_value);
});

html: 

<input id="input_box" />
<p id="result"></p>

小提琴:http://jsfiddle.net/a8jbF/

——更新

新提琴:http://jsfiddle.net/a8jbF/1/

使用超时，以便可以对更新代码进行节流

—Update 2—

上面的代码按原样工作-但是它有很多开销，因为您每次击键都要更改每个变量-无论是否正在修改输入-

如果你设置这样做与一个函数，并希望提高性能，我会添加延迟函数(在我的第二fiddle)，然后修改你的functionName一点，以减少(一些)开销:

function functionName(){
    // wrap your variable set in a delay
    delay(function(){
        // actions to do after the delay is complete
        var myvar = parseFloat(jQuery("#input_box").val());
        var myvar2 = parseFloat(jQuery("#input_box_2").val());
        var myvar3 = parseFloat(jQuery("#input_box_3").val());
    }, 1000);
  }

您可以使用focusout()在每次输入失去焦点时捕获输入。

$("#input_box").focusout(function() {
    //Assign the value somewhee
    var myVar = $(this).val();
});

演示:http://jsfiddle.net/8wY7Q/

$('#inputBox')处理事件blur或focusout

相关文章：