Ajax函數無法打開頁面

Question

我不明白為什么Ajax無法正常工作。 我的代碼：

<script type="text/javascript" src="js/jquery-1.9.1.js"></script>
    <script type="text/javascript">
    function edit_row(id)
    {
        $.ajax({
            method:'get',
            url:'form.php',
            success:function(data)
            {
              $('#form_div').html(data);
            }
        });

    }

<?php
   echo '<td style='.$style.'>'.$status.'<a href="" title="Edit"  onClick=edit_row('.$data['type_id'].')><img src="images/pencil.png" width="30px" height="30px"></a></td></tr>';
?>

它沒有打開form.php onclick是什么問題，請幫幫我！！！

Answer 1

您單擊鏈接。 JavaScript運行。 鏈接被跟隨。 將加載一個新頁面（具有相同的URL，因為您擁有href="" ）。 JavaScript停止是因為其環境已消失。

請改用按鈕。

Answer 2

你必須把

href="javascript:void(0)"

代替

href=""

否則它將重新加載頁面而不調用ajax

Answer 3

您沒有將'id'傳遞給form.php，我想您需要傳遞它：

<script type="text/javascript" src="js/jquery-1.9.1.js"></script>
    <script type="text/javascript">
    function edit_row(id)
    {
        $.ajax({
            method:'get',
            url:'form.php',
            data: {id: id },
            success:function(data)
            {
              $('#form_div').html(data);
            }
        });

    }
</script>

Answer 4

我會做這樣的事情（不使用onClick屬性）：

<script type="text/javascript" src="js/jquery-1.9.1.js"></script>
<script type="text/javascript">
    $(function() {
        $('a.edit').click(function(e) {    // or: $.on('click', 'a.edit', function(e) {
            e.preventDefault();
            var id = $(this).attr('id');
            $.ajax({
                method:'get',
                url: 'form.php',
                data: {id:id},
                success: function(data) {
                    $('#form_div').html(data);
                }
        });
    });
</script>

<?php
    echo '<td style="$style">$status
          <a href="#" id="' . $data['type_id'] . '"  title="Edit" class="edit">
          <img src="images/pencil.png" width="30px" height="30px">
          </a></td></tr>';
?>