$(this).val()不返回value-tag的值

时间:2017-12-29 18:48:15

标签: javascript jquery

我正在尝试获取value - 标记的<a> - 属性,该示例位于以下示例999中。请参阅下面的最低可行示例:

<!DOCTYPE html>
<html>

<head>
  <title>Jquery Modal</title>
</head>

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

<script>
  $(document).ready(function() {
    //display modal form for product EDIT ***************************
    $(document).on('click', '.open_modal', function() {
      var cryptos_id = $(this).val();
      console.log("cryptos_id: " + cryptos_id)
    });

  });
</script>

<body>
  <div>
    <tr>
      <a id="coo99" value="999" class="open_modal" data-target="#myModal">
        <sup> EDIT</sup>
      </a>
    </tr>
  </div>

  <!-- MODAL SECTION -->
  <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
          <h4 class="modal-title" id="myModalLabel">Edit</h4>
        </div>
        <div class="modal-body">
          <form id="frmProducts" name="frmProducts" class="form-horizontal" novalidate="">
            <div class="form-group error">
              <label for="inputName" class="col-sm-3 control-label">Name: </label>
              <div class="col-sm-9">
                <input type="text" class="form-control has-error" id="name" name="name" placeholder="Country of Origin" value="">
              </div>
            </div>
          </form>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-primary" id="btn-save" value="update">Edit Entry</button>
          <input type="hidden" id="product_id" name="product_id" value="101">
        </div>
      </div>
    </div>
  </div>

</body>

</html>

当您按下EDIT按钮crypto_id时,当前没有任何内容返回,但我希望得到value的{​​{1}} - 属性 - 999 - -tag back。

有什么建议我做错了吗?

2 个答案:

答案 0 :(得分:4)

值仅适用于表单字段元素。您需要改为使用数据属性:

&#13;
&#13;
$(document).on('click', '.open_modal', function() {
  var cryptos_id = $(this).data('value');
  console.log("cryptos_id: " + cryptos_id)
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<a id="coo99" class="open_modal" href="#" data-value="999" data-target="#myModal">Open Modal</a>
&#13;
&#13;
&#13;

答案 1 :(得分:2)

你正在看错了。

$(this).val()无法告诉您之后的情况,您需要使用$(this).attr("value")之类的内容。这将获取属性&#34; value&#34;。

中定义的任何内容

.val()主要用于表单,即input个实体)。

相关问题