Question

我正在构建一个包含3个输入[text]的动态小长度转换器。像这样

<input type='text' class='bx' id='cm'> Centimeter<br>
<input type='text' class='bx' id='m'> Meter<br>
<input type='text' class='bx' id='km'> Kilometer<br>

效果如下：如果单击“Meter”，则值变为''，如果键入值，则“Centimeter”和“Kilometer”值将等于值（...）。

Example

jquery就像这样：

$(function() {

var selected = ????;

// do i need something here to empty the input it is focused on?

$("#cm").val(selected * 545);
$("#km").val(selected * 545);
$("#m").val(selected * 453);

})

我希望所选的var等于它所关注的文本输入的值。

我该怎么做？

示例中的计算内容丰富。

Answer 1

您可以使用jQuery焦点来获取选定的输入字段。

 $(function() {
         $("input.bx").focus({
          var selected  =parseInt(this.value, 10);
              this.value = ''; //this line will remove text from selected input.
              $("#cm").val(selected * 545);
              $("#km").val(selected * 545);
             $("#m").val(selected * 453);
         });
    })

Answer 2

var selected = $(this).val();

// //您编写的代码仅在您第一次加载页面时起作用。如果您希望它在每次单击时都能工作，您需要处理输入的焦点事件..

 $('#cm , #km , #m').on('focus', function() {
        var selected = parseInt($(this).val() , 10) ; // Will convert to a Int

        $("#cm").val(selected * 545);
        $("#km").val(selected * 545);
        $("#m").val(selected * 453);

    });

但我认为模糊事件更有意义，而不是焦点事件..

FIDDLE

这将指向所选输入的值

Answer 3

您必须实现侦听焦点事件的侦听器。

检查一下：

http://api.jquery.com/focus/

$('.bx').focus(function() {
    var id = $(this).attr("id");
    if (id === "cm") {
        alert('Handler for .focus() called cm');
    }
    else if (id === "m") {
        alert('Handler for .focus() called m');
    }
    else if (id === "km") {
        alert('Handler for .focus() called km');
    }
});

Answer 4

您需要一个事件处理程序，在本例中为focus event：

$(function() {
     $(".bx").focus(function(e) {
         var selectedval = this.value,
             selectedtype = this.id;
         …
     });
});

jQuery var等于它关注的输入框的值

4 个答案: