如何从html检索jQuery值

sir-haver • 5 年前 • 1460 次点击

模式触发器:

<a data-toggle='modal' data-name='$nameCap' data-id='$id' class='open-DeleteDialog' href='#deleteDialog'><i class='fas fa-trash-alt'></i></a>

主要工作:

$(document).on("click", ".open-DeleteDialog", function () {
    var categoryId = $(this).data('id');
    var categoryName = $(this).data('name');
    $("#categoryId").val( categoryId );
    $('#deleteConfirmation').text("Are you sure you want to delete this category: " + categoryName + "?");
});

模态内部:

  <div class="modal-body">
    <div id="deleteConfirmation">
      <!-- Filled with confirmation from jquery -->
    </div>
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
    <button id="saveChanges" type="button" class="btn btn-danger">Delete</button>
    <script>

      $(function() {

        $('#saveChanges').on('click', function() {
          var id = $( "#categoryId").val();
          console.log(id)
        });


      });
    </script>

我试图获取categoryId值,但在记录时,它返回未定义的值。我做错什么了?

Python社区是高质量的Python/Django开发社区
本文地址：http://www.python88.com/topic/54058

1460 次点击

文章 [ 2 ] | 最新文章 5 年前

• 1 楼

Fritz Gerald Dumdum 5 年前

$(function(){
  var categoryId;
  $(document).on('click', '.open-DeleteDialog', function(e){
    categoryId = $(this).data('id');
  })

  $('#saveChanges').on('click', function(e){
    alert(categoryId);
  })
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a data-toggle='modal' data-name='$nameCap' data-id='123' class='open-DeleteDialog' href='#deleteDialog'><i class='fas fa-trash-alt'></i>123</a>

<a data-toggle='modal' data-name='$nameCap' data-id='456' class='open-DeleteDialog' href='#deleteDialog'><i class='fas fa-trash-alt'></i>456</a>

<button id="saveChanges" type="button" class="btn btn-danger">Delete</button>

为什么不创建全局变量而不是创建隐藏元素?

var categoryId;

$(document).on("click", ".open-DeleteDialog", function () {
    // initialize category id
    categoryId = $(this).data('id');
});

正在获取类别id值

$('#saveChanges').on('click', function() {
      console.log(categoryId )
});

$(function() {
    // global variable
    var categoryId;

    $(document).on("click", ".open-DeleteDialog", function () {
        // initialize category id
        categoryId = $(this).data('id');
    });

    $('#saveChanges').on('click', function() {
        console.log(categoryId )
    });
})

• 2 楼

Phong 5 年前

你应该加上 categoryId 元素 hidden

<input type="hidden" id="categoryId" />

$(document).on("click", ".open-DeleteDialog", function () {
    var categoryId = $(this).data('id');
    $("#categoryId").val(categoryId);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a data-toggle='modal' data-name='$nameCap' data-id='123' class='open-DeleteDialog' href='#deleteDialog'><i class='fas fa-trash-alt'></i>123</a>

<a data-toggle='modal' data-name='$nameCap' data-id='456' class='open-DeleteDialog' href='#deleteDialog'><i class='fas fa-trash-alt'></i>456</a>

<input type="hidden" id="categoryId" />
<hr/>

<div class="modal-body">
    <div id="deleteConfirmation">
      <!-- Filled with confirmation from jquery -->
    </div>
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
    <button id="saveChanges" type="button" class="btn btn-danger">Delete</button>
    <script>
      $(function() {
        $('#saveChanges').on('click', function() {
          var id = $( "#categoryId").val();
          console.log(id)
        });
      });
    </script>

登录后回复