Php 链接ajax加载页面上的脚本的良好实践_Php_Jquery_Html_Ajax

Php 链接ajax加载页面上的脚本的良好实践

php jquery html ajax

Php 链接ajax加载页面上的脚本的良好实践,php,jquery,html,ajax,Php,Jquery,Html,Ajax,我有一个名为index.php的页面，在这个页面上我有一个表单，它接受一个数字，通过ajax处理表单，并在同一页面上返回结果 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>Ordertrack</title>

我有一个名为index.php的页面，在这个页面上我有一个表单，它接受一个数字，通过ajax处理表单，并在同一页面上返回结果

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Ordertrack</title>
    <link rel='stylesheet' type='text/css' href='css/style.css' />
    <link rel='stylesheet' type='text/css' href='css/print.css' media="print" />
</head>
<body>
    <form action="processing.php" id="submitsearch" method="post">
    <input type="text" name="ordernum" value="">
    <input type="submit" />
  </form>
<div id="searchresults"></div>
<script src="js/jquery.js"></script>
<script src="js/example.js"></script>
</body>
</html>

这是我的processing.php

你的钮扣

 <input type="submit" id='btnSubmit'/>

这似乎不起作用。我甚至尝试了提交。我已经编辑了我的答案。请检查它是否解决了您的问题。您的代码提交表单并将其处理到processing.php，但正如我所说的，我想检查processing.php上的链接，如果它存在，请执行一些操作。当我将这个检查脚本添加到processing.php时，它就可以正常工作了。这是processing.php delete上的一个链接。我只想知道什么是好的做法我的代码运行良好。这是一个坏的做法。您不应该在ajax上添加js和css。在提交ajax请求之前，您可以检查客户端是否存在某些内容。不管您有什么问题，我建议您将对jQuery脚本的调用放在标题中，而不是正文中。我成功地使您的代码正常工作，而无需添加任何特殊内容。。。。你确定你的jQuery是合法的吗？您可以在这里看到代码正在工作，我试图解释的是代码的这一部分'if$.item-row.length==1{$a.delete.hide；}；'如果我把它放在'example.js'中，它就不起作用了。我在'index.php'中称之为'example.js'，而不是在'processing.php'中称之为'example.js'。您的代码（删除行的代码）是在将实际表/行添加到DOM之前执行的，因此，一旦ajax返回页面，脚本就已经执行，不再执行。一个很好的实践或简单的解决方案是，在执行.htmlresponse后，从ajax调用的“success”部分调用此代码，或者通过一些更改侦听器调用此代码。这回答了你的问题吗？所以我不应该在processing.php中链接example.js，对吗？这是不好的做法，什么是改变听众？有参考资料吗？

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Ordertrack</title>
  <link rel="stylesheet" href="">
</head>
<body>
      <div id="page-wrap">

    <div style="clear:both"></div>

    <div id="customer">

    </div>
    <div class="border-rtlt"></div>

    <div class="border-rtlt"></div>
    <table id="items">

      <tr>
          <th>Products</th>
          <th>SKU</th>
          <th>Price</th>
          <th>Qty</th>
          <th>Discount</th>
          <th>Subtotal</th>
      </tr>
      <tr class="item-row">
          <td class="description"><div class="delete-wpr"><textarea>data</textarea><a class="delete" href="javascript:;" title="Remove row">X</a></div></td>
          <td><textarea>data</textarea></td>
          <td><textarea class="cost">data</textarea></td>
          <td><textarea class="qty">data</textarea></td>
          <td><span>data</span></td>
          <td><span class="price">data</span></td>
      </tr>
      <tr id="hiderow">
        <td colspan="6"><a id="addrow" href="javascript:;" title="Add a row">Add a row</a></td>
      </tr>

      <tr>
          <td colspan="3" class="blank"> </td>
          <td colspan="2" class="total-line">Subtotal</td>
          <td class="total-value"><div id="subtotal">data</div></td>
      </tr>
      <tr>

          <td colspan="3" class="blank"> </td>
          <td colspan="2" class="total-line">Total</td>
          <td class="total-value"><div id="total">data</div></td>
      </tr>

    </table>

  </div>
  <script>
     if ($(".item-row").length == 1) {
      $("a.delete").hide();
    };
  </script>
</body>
</html>

 <input type="submit" id='btnSubmit'/>

$( "#btnSubmit'" ).click(function( event ) {
event.preventDefault();
 $.ajax({ 
        data: $( "#submitsearch'").serialize(), 
        type: $("#submitsearch'").attr('method'), 
        url: $("#submitsearch'").attr('action'),
        success: function(response) { 
            $('#searchresults').html(response);
            $('#submitsearch').hide();
        }
    });
    return false;
});