2014-03-06 150 views
0

我想改變div的內容使用jQuery。但內容會閃爍並重置div。我無法使用return false;,因爲有另一個按鈕用於發佈文本字段值。我想保留div的變化。這裏是我的代碼:jquery重置我的div內容

<html> 
<head> 
    <meta charset="UTF-8"> 
    <title></title> 
    <script type="text/javascript" src="jquery.js"></script> 

</head> 
<body> 

    <div> 
     <form id="form" method="POST"> 
      <input type="text" name="gname" id="gname"/></br> 
      <button id="btn">Set</button> 
      <button id="nbtn">View</button> 
     </form> 
    </div> 
    <div id="outp"> 

    </div> 
</body> 
<script> 
    $("#btn").click(function(event) { 
     $.post("send.php", { 
      named: $("#gname").val()}, function(data) { 
      alert(data); 
     }); 
    }); 

</script> 

<script> 
    $("#nbtn").click(function(e) { 

     $("#outp").html("<?php include './view.php'; ?>"); 

    }); 
</script> 

+0

第一修正你
元素 - 應該是
user2728841

+0

在你的代碼,$( 「#OUTP」)HTML(」

我的新文本

「);檢查並看看會發生什麼 – noobcode

回答

2

這不是jQuery的;這是你的表格被張貼。因此,您的更改已完成,但表單已發佈並且頁面已從服務器刷新。

button元素的默認類型爲"submit"。要使這些按鈕中的一個或兩個都成爲一個按鈕,請使用type="button"。或者,如果您希望允許在禁用JavaScript(例如,允許將其正常發佈)時使用表單,請將按鈕保留爲提交按鈕,但應避免使用JavaScript提交表單。例如:

$("#form").submit(false); // Prevents the form being submitted in the normal way. 
+0

thanx。這有幫助。刪除表單標籤,它的工作。 –

+0

@ user3383167::-)如果您不需要針對禁用JavaScript的瀏覽器進行回退,那麼這是另一種方式。 –

2

表單中的任何按鈕都被認爲是submit按鈕。

因此,您需要將event.preventDefault()添加到您的.click代碼中。

此外,爲什麼您的腳本在body部分之外?

-1

您可以使用Ajax和捕捉成功和錯誤嘗試:

$("#btn").click(function() { 
    var named: $("#gname").val(); 
    $.ajax({ 
     url: 'send.php', 
     type: 'POST', 
     data: {param1: 'value1'}, 
    }) 
    .done(function(data) { 
     console.log("Post success"+data); 
    }) 
    .fail(function() { 
     console.log("Post error"+data); 
    });  
});