Question

你好每个人都有问题这是我的jquery代码

<script type="text/javascript">
    $('#com').keypress(function (event) {
        var comm = $(this).val();

        var keycode = (event.keycode ? event.keycode : event.which);
        if (keycode == 13) {
            var comm = $("#com").val();
            alert(comm);
            var hidid = $("#hidid").val();
            alert(hidid);

            $.ajax({
                cache: false,
                type: "POST",
                url: "/Home/postComment",
                datatype: "json",
                data: { comment: comm, hidid: hidid },
                error: function () {
                    alert("error ");
                },
                success: function () {
                    window.location.href = "/Home/Index";
                }
            });
        }
        event.stopPropagation();
    });
</script>

我在这样的控制器中调用它

[HttpPost]
    public JsonResult postComment(string comment,int hidid)
    {
        Repository<whichOne> _rwo = new Repository<whichOne>();
        Repository<Comment> _rc = new Repository<Comment>();

        int _userId = Convert.ToInt32(Session["_userId"]);

        Comment _comment = new Comment
        {
            userId = _userId,
            comment = comment,
            createDate = DateTime.Now,
            isValid = true,
            whichOneId = hidid,
        };

        _rc.Add(_comment);
        _rc.Save();

        return Json(new { success = true });
    }

我有来自数据库的数据，我正在尝试获取我的数据的id并从输入中发表评论

@foreach (var item in Model._mywhichOneHelper)
                {
          @Html.Hidden("hidid",@item.id)
          <input type="text" class="pull-left input-sm form-control" id="com" name="comments" style="border-radius: 12px;" placeholder="Your Comments...">}

然而，当我写完东西后，我只能输入第一个数据。 Keypress不适用于其他数据我能为此做些什么？

enter image description here

正如您所看到的那样，当我写入并单击“输入”进行第一次输入时，它可以正常工作，但是当我尝试使用其他数据时，没有任非常感谢你。

Answer 1

这里的问题是你的jQuery选择器只找到第一个元素，因为它只期望一个元素有一个id（id应该是唯一的）。

使用具有相同ID的多个元素不是一个好习惯 - 这是您问题的一部分。如果您可以重新设计标记以使元素具有唯一ID，但共享一个类（例如class =“com”），那么您可以轻松编写jQuery选择器来查找它们。在这种情况下，仍然有一个解决方法，你可以像这样使用jQuery选择器：[id=com]而不是#com，这将找到所有匹配的元素，而不是仅查找一个（预期）元素那个独特的身份。

另请注意，我必须更改您的事件处理程序，以便它不使用另一个jQuery选择器，而是将值$self传递给闭包，以便它保持正确的唯一实例，而不是始终找到第一个。

$(function() {
  $("[id=com]").keypress(function(event) {
      var $self = $(this);
      var comm = $self.val();

      var keycode = (event.keycode ? event.keycode : event.which);
      if (keycode == 13) {
        var comm = $self.val();
        alert(comm);
        event.stopPropagation();
      }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<input type="text" class="pull-left input-sm form-control" id="com" name="comments" style="border-radius: 12px;" placeholder="Your Comments...">
<br />
<input type="text" class="pull-left input-sm form-control" id="com" name="comments" style="border-radius: 12px;" placeholder="Your Comments...">
<br />
<input type="text" class="pull-left input-sm form-control" id="com" name="comments" style="border-radius: 12px;" placeholder="Your Comments...">
<br />

更好的方法是使用唯一的ID，并通过类选择，如下所示：

$(function() {
  $(".com").keypress(function(event) {
    var $self = $(this);
    var comm = $self.val();

    var keycode = (event.keycode ? event.keycode : event.which);
    if (keycode == 13) {
      var comm = $self.val();
      alert(comm);
      event.stopPropagation();
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<input type="text" class="pull-left input-sm form-control com" id="com1" name="comments" style="border-radius: 12px;" placeholder="Your Comments...">
<br />
<input type="text" class="pull-left input-sm form-control com" id="com2" name="comments" style="border-radius: 12px;" placeholder="Your Comments...">
<br />
<input type="text" class="pull-left input-sm form-control com" id="com3" name="comments" style="border-radius: 12px;" placeholder="Your Comments...">
<br />

具有相同id的多个输入的jquery按键功能

1 个答案: