如何将java脚本变量作为值加载到引导模型文本框中

Question

我在将 javascript 变量加载到引导程序模型输入框中时遇到了一些问题：

setTimeout(function() {
  swal({
      title: "OverTime Status!",
      text: "You Need to get Sub OT Approval " + data.value + " Hours to Time allocate in the department",
      type: "warning",
      confirmButtonText: "OK"
    },
    function(isConfirm) {
      if (isConfirm) {

        $('#hours_work').val(data.value); //data.value alert the correct value in here.but this value not load in to the bootstrap model text box 
        $('#overtime_requset').modal('show');
        clear_field();
      }
    });
}, 1);

<div class="modal" id="overtime_requset">
  <div class="modal-dialog ">
    <form id="overtime_requset_form">
      <div class="modal-content">

        <!-- Modal Header -->
        <div class="modal-header">
          <h4 class="modal-title">Sub OT Request</h4>
          <button type="button" class="close" data-dismiss="modal">&times;</button>
        </div>

        <!-- Modal body -->
        <div class="modal-body">
          <div class="form-group">
            <div class="input-daterange">
              <input type="text" name="from_date" id="from_date" class="form-control" value="<?php echo $_GET[" month "]; ?>" readonly />
              <span id="error_from_date" class="text-danger"></span>
              <span id="error_future_from_date" class="text-danger text-center"></span>
            </div>
          </div>
          <div class="form-group">
            <label class="text-info">Tolal Number Of Employee <?php echo get_total_employee_count($connect,$_SESSION["dept_Id"])?></br>
            <label>Add the addition number of OT hours requried</lable>
            <input type="text" name="hours_work" id="hours_work"  class="form-control" value=""/>
            <label class="text-secondary">Approved OT hours :   <?php echo GetApprovedOt($connect,$_SESSION["dept_Id"],$currentMonth)?></br></label><br>
            <label class="text-secondary">Pendding OT hours :  <?php echo GetPendingOt($connect,$_SESSION["dept_Id"],$currentMonth)?></label>
          </div>
        </div>
        <!-- Modal footer -->
        <div class="modal-footer">
          <button type="button" name="get_approval" id="get_approval" class="btn btn-info btn-sm">Get Approval</button>
          <button type="button" class="btn btn-danger btn-sm" data-dismiss="modal">Close</button>
        </div>

      </div>
    </form>
  </div>
</div>

data.value 提醒此处的正确值。但是这个值不会加载到引导模型文本框中。我的错误是什么？我如何解决它？（唯一的问题是传递 JavaScript 值不会加载到文本字段的内侧。它可以作为 HTML 打印到 div 标签中）

更新 我使用以下 cdn sweetAlert boostrap

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-sweetalert/1.0.1/sweetalert.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-sweetalert/1.0.1/sweetalert.min.css" />

Answer 1

你发布的代码有点缺乏并且有一些错误，无论如何我试图复制你的问题，我想我可能已经让它工作了。看看下面的 jsfiddle 片段，看看您是否可以在代码中实现以使其正常工作。

首先查看此链接： https : //jsfiddle.net/b1nary/je60gxv8/2/

更新了你的甜蜜警报： https ://jsfiddle.net/b1nary/je60gxv8/11/

setTimeout(function() {
    swal({
    title: "OverTime Status!",
    text: "You Need to get Sub OT Approval " + data_val + " Hours to Time allocate",
    type: "warning",
    showCancelButton: true,
    confirmButtonText: "Yes, do it",
    closeOnConfirm: false,
    html: false
  }, function(){
    swal("Deleted!",
    "Poof! Your number has been added to input box!",
    "success");
    $('#hours_work').val(data_val); 
    $('#overtime_requset').modal('show');
    //clear fields    
  });

}, 1000 );