Question

我目前有一个html格式的按钮，在单击时执行一个函数：

<input type="button" onclick="do_action_1();">

但我有两个功能：

do_action_1()
do_action_2()

我还有两个文本框：

<input id="tb1" type="text" name="textbox1">
<input id="tb2" type="text" name="textbox2">

如果用户的光标在textbox1中，我希望按钮执行

do_action_1

但如果用户的光标在textbox2中，我希望按钮执行

do_action_2.

我不确定从哪里开始这样做，所以非常感谢任何帮助。

Answer 1

为每个输入添加onclick事件，并在其中更改目标元素属性attr值

$('#tb1').click(function(){
  $('.change_function').attr("onclick","do_action_1();");
});
$('#tb2').click(function(){
  $('.change_function').attr("onclick","do_action_2();");
});

function do_action_1(){
  alert("function 1 is selected !");
}
function do_action_2(){
  alert("function 2 is selected !");
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<input type="button" onclick="do_action_1();" class="change_function" value="Change Function">
Function 1<input id="tb1" type="text" name="textbox1">
Function 2<input id="tb2" type="text" name="textbox2">

修改

您还可以在下面的评论中使用{strong> katz 和 Eddie 时使用focus事件，因为输入字段可能处于活动状态而不会点击它标签键。

$('#tb1').focus(function(){
  $('.change_function').attr("onclick","do_action_1();");
});
$('#tb2').focus(function(){
  $('.change_function').attr("onclick","do_action_2();");
});

Answer 2

我不确定我完全理解你的问题但也许onfocus句柄很有帮助

var tb1 = document.getElementById('tb1');
var tb2 = document.getElementById('tb2');

tb1.onfocus = function(){
  console.log('1')
  do_action_1
}

tb2.onfocus = function(){
  console.log('2')
  do_action_2
}

Answer 3

我实际上会使用onfocus在文本框中设置一个类，然后使用该类来查看要执行的操作：

$('input[name^="textbox"]').on('focus',function () {
  $('input[name^="textbox"]').removeClass('active');
  $(this).addClass('active');
});

function do_action () {
  if ($('input[name="textbox1"]').is('.active')) do_action_1();
  else do_action_2();
}

根据光标位置执行不同的函数（javascript）

3 个答案:

修改