javascript - 将方括号 () 附加到输入字段并将光标放在它们之间

Question

使用or、not 和() 运算符组合一个非常基本的查询生成器。我将它们附加到输入字段，但我认为如果将括号运算符按钮附加到输入字段时，光标将被放置(此处)，为用户查询做好准备，这对用户是有益的.

到目前为止我已经:

   // query builder functions
$(function() {
  var queryinput = $( "#query-builder-modal .search-box input.querybuilder" );

  $('#query-builder-modal ul.operators li.or').click(function(){
    queryinput.val( queryinput.val() + "OR" );
    queryinput.focus();
  });

  $('#query-builder-modal ul.operators li.not').click(function(){
    queryinput.val( queryinput.val() + "-" );
    queryinput.focus();
  });

  $('#query-builder-modal ul.operators li.brackets').click(function(){
    queryinput.val( queryinput.val() + "()" );
    queryinput.focus();
  });
});

任何人都可以帮我将光标放在此示例代码的第三个单击函数中的括号之间吗？

提前致谢

Answer 1

你可以尝试这样的事情:

$('#query-builder-modal ul.operators li.brackets').click(function(){
    queryinput.val( queryinput.val() + "()" );
    var pos = queryinput.val().length - 1;
    myInput.focus(); /* Seems mandatory for Firefox/Opera */
    queryinput[0].selectionStart = queryinput[0].selectionEnd = pos;
});

jsfiddle 示例 here

编辑:似乎对于 Firefox 和 Opera，您必须首先 focus() 您的输入，但在 Safari 和 Chrome 上则不然。我更新了代码和 jsfiddle。