单击按钮时未单击JS函数

如何解决单击按钮时未单击JS函数

我有一个按钮，我试图点击“复制”以触发以下功能。你能指导我正确的方法吗？

当前，当我单击时什么也没有发生！没有回应。我需要在点击时触发该功能。

预先感谢

$(document).on('click','.js-duplicateRoom',function (e) {
            var hiddenInput = $(this).parent().find('input[name="roomId"]');
            var roomId = hiddenInput.data('id');
            var type = 'duplicate';

            $.ajax({
                type: "GET",url: "/management/hostaccommodation/AddRoom?roomId=" + roomId + '&type=' + type,}).done(function (result) {
                $('#addRoomresult').html(result);
                // Hide Add Room Button
                $('#addNewRoom').hide();
                $('#backToDetails').hide();
                $('#nextPropertyExtras').hide(); // Next button
            });
        });

HTML

<div class="modal fade" id="duplicateModal" tabindex="-1" role="dialog" aria-labelledby="duplicateModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="duplicateModalLabel">Confirm Duplicate</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <p>Are you sure you would like to duplicate this Room?</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-outline-secondary" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-success" id="js-duplicateRoom" >Duplicate</button>
            </div>
        </div>
    </div>
</div>

解决方法

该按钮由ID（而不是类）标识。因此，请尝试以下方法：

$(document).on('click','#js-duplicateRoom',function(e) {
  var hiddenInput = $(this).parent().find('input[name="roomId"]');
  var roomId = hiddenInput.data('id');
  var type = 'duplicate';

  $.ajax({
    type: "GET",url: "/management/hostaccommodation/AddRoom?roomId=" + roomId + '&type=' + type,}).done(function(result) {
    $('#addRoomResult').html(result); // Hide Add Room Button
    $('#addNewRoom').hide();
    $('#backToDetails').hide();
    $('#nextPropertyExtras').hide(); // Next button
  });
});