Question

美好的一天。我想模拟＆＃39; tab＆＃39;从我的功能按键。我想只允许在某个范围之间输入，然后将光标返回到另一个范围。如果用户输入的数量超出范围内的位置，则光标应自动移动到下一个范围。我搜索了一些例子，想法。并且在不同来源中发现了非常相似的例子。试过......在我的案子中它并不起作用。

[*] - 表示输入范围

拜托，有人可以帮助我吗？

我的代码：

＆＃13;

var starts = [22, 47];
var ends = [24, 50];
var tabIndex = 1;
var inputIndex = 0;
var textarea = $("#inputText");

function setSelectionRange(input, start, end) {
  if (input.setSelectionRange) {
    input.focus();
    input.setSelectionRange(start, end);
  } else if (input.createTextRange) {
    var range = input.createTextRange();
    range.collapse(true);
    range.moveEnd('character', end);
    range.moveStart('character', start);
    range.select();
  }
}

function setCaretToPos(input, pos) {
  setSelectionRange(input, pos, pos);
}

$(document).ready(function() {
  textarea.keypress(function(e) {
    if (e.keyCode == 13) {
      $('form').submit();
      e.preventDefault();
    } else if (e.keyCode == 9) {
      e.preventDefault();
      if (tabIndex >= starts.length) {
        tabIndex = 0;
      }
      setCaretToPos(document.getElementById("inputText"), starts[tabIndex]);
      tabIndex++;
    }
  });
});

textarea.on("input", function() {
  var pos = $(this).val().slice(0, this.selectionStart).length;
  if (inputIndex <= starts.length) {
    var before = textarea.val().slice(0, starts[inputIndex]);

    if (this.selectionStart > starts[inputIndex] && this.selectionStart <= ends[inputIndex]) {
      $(this).val($(this).val().slice(0, this.selectionStart) + $(this).val().slice(this.selectionStart + 1));
      setCaretToPos(this, pos);
    }
    var after = textarea.val().slice(ends[inputIndex]);
    if ($(this).val().indexOf(before) !== 0) {
      $(this).val(before + $(this).val().slice(before.length, ends[inputIndex]) + after);
    } else if (this.selectionStart >= ends[inputIndex]) {
      $(this).val(before + $(this).val().slice(before.length, ends[inputIndex]) + after);
      inputIndex++;
      var e = $.Event("keypress", {
        keyCode: 9
      });
      e.keyCode = 9;
      $("textarea").trigger(e);
    }
  } else {
    inputIndex = 0;
  }

});

setCaretToPos(document.getElementById("inputText"), starts[0]);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="">
  <meta name="author" content="">
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" type="text/javascript"></script>
</head>

<body>
  <form action="/myAction" method="post" modelAttribute="displayVal">
    <p><textarea id="inputText" name="inputText" rows="25" cols="25" style="overflow: auto" required>some long text. Input **. Text again. Input 2: ***.</textarea></p>
  </form>
</body>

</html>

＆＃13;

我看到了示例here

and here

Answer 1

只需输入

即可

<rewrite>
      <rules>
        <rule name="HTTP/S to HTTPS Redirect" enabled="true" stopProcessing="true">
        <match url="http://(.*)" />
        <conditions logicalGrouping="MatchAny">
                    <add input="{HTTPS}" pattern="^OFF$" />
        </conditions>
        <action type="Redirect" url="https://{HTTP_HOST}{REQUEST_URI}" redirectType="SeeOther" />
        </rule>
      </rules>
</rewrite>

中的

声明

var textarea = $("#inputText");

事件，因为在执行此代码时，DOM尚未在html中呈现。见下面的代码：

$(document).ready...

为什么keypress事件不发送

1 个答案: