PHP / HTML 模态警报

Question

<div id="editproductdiv" onclick="editproduct();"> </div>


<div id="editproductform" class="modal fade" role="dialog">
  <div class="modal-dialog" style="width:1000px;">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Cancellation Reason </h4>
      </div>

      <div class="modal-body" id="editproduct" style="display:inline-block">
      </div>
      <div class="modal-footer" style="display:none;">
      </div>
    </div>

  </div>
</div>


<script>
function editproduct() {
    $('#editproductform').modal('show');
        $.ajax({
              url: 'index.php?route=order/order_details/editproduct',
            dataType: 'json',
            type: 'post',
            data: ,
            beforeSend:function(){
              $("#editproduct").html('loading');
            },
            success:function(json){
                if(json['error']){
                    // alert(json['error']);
                } else {
                    $("#editproduct").html(json['editproduct']);
                }
            }
        });
    }

</script>

问题：当我点击我的视图页面中的按钮时，出现此警报：https://prnt.sc/s8gn6w

错误代码：

function(e){var t,n,r,i=this[0];{if(arguments.length)return r=g(e),this.each(function(n){var i;1===this.nodeType&&(null==(i=r?e.call(this,n,w(this).val()):e)?i="":"number"==typeof i?i+="":Array.isArray(i)&&(i=w.map(i,function(e){return null==e?"":e+""})),(t=w.valHooks[this.type]||w.valHooks[this.nodeName.toLowerCase()])&&"set"in t&&void 0!==t.set(this,i,"value")||(this.value=i))});if(i)return(t=w.valHooks[i.type]||w.valHooks[i.nodeName.toLowerCase()])&&"get"in t&&void 0!==(n=t.get(i,"value"))?n:"string"==typeof(n=i.value)?n.replace(bt,""):null==n?"":n}}

我没有任何警报按钮，但这仍然显示知道为什么吗？

Answer 1

问题出在你的函数中，你错过了开始标签（。还有空数据

而不是function editproduct)

使用

function editproduct()

并且您需要服务器来运行 PHP 文件，下载 WAMP or XAMPP 因为没有理解 PHP 的服务器它只会下载页面.

Answer 2

是因为函数中缺少 ( 或左括号更改为

function editproduct()

Answer 3

<head>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>

</head>
<body>
<button id="editproductdiv" name="editproductdiv" > click here</button>


<div class="container">


  <!-- Modal -->
  <div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog">

      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Modal Header</h4>
        </div>
        <div class="modal-body">
          <p>Some text in the modal.</p>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>

    </div>
  </div>

</div>
<script>

    $(document).ready(function(){
      $("#editproductdiv").click(function(){
                 $("#myModal").modal();
      });
    });

</script>
</body>

Answer 4

 <button type="button" onclick="editproduct();" name="button">button</button>


<div id="editproductform" class="modal fade" role="dialog">
  <div class="modal-dialog" style="width:1000px;">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Cancellation Reason </h4>
      </div>

      <div class="modal-body" id="editproduct" style="display:inline-block">
      </div>
      <div class="modal-footer" style="display:none;">
      </div>
    </div>

  </div>
</div>


  <script type="text/javascript">
      function editproduct(){
        //alert("ok");
         $('#editproductform').modal('show');
         $.ajax({
                     url: 'action.php',
                     dataType: 'json',
                     type: 'post',
                     data: {
                       route : 'your_route' //this you can post your every data by using comma (,)
                     },
                     beforeSend:function(){
                       $("#editproduct").html('loading');
                     },
                     success:function(json){
                       console.log(json);
                         if(json.error){
                             // alert(json['error']);
                         } else {
                             $("#editproduct").html(json.editproduct);
                         }
                     }
                 });


      }
  </script>
  </body>
</html>

我已将 action.php 用于您的 php 脚本。并认为这会有所帮助

PHP / HTML 模态警报

PHP / HTML modal alert

html

javascript

php

modal-dialog