2012-07-26 77 views
0

在使用POST方法提交表單後,我有使用JavaScript更改HTML文檔中內容的麻煩。我需要將HTML文檔中的div的顏色更改爲黃色,我已經完成了該操作,但問題在於,當它更改爲黃色後,HTML網站會在導航器中刷新,然後恢復正常(白色)。它閃爍黃色,然後再次變成白色。如何在POST方法後使用javascript更改HTML內容

這裏是我的HTML代碼:

<form action="" method="post" onSubmit="return changeColor()"> 
. 
. 
. 
<div id="divColor"> 
. 
. 

這是我的JavaScript代碼來改變DIV顏色:

function changeColor() 
{ 
    var div = document.getElementById("courselist"); 
    div.style.backgroundColor='yellow'; 
} 

我需要做的是這種方式,因爲是任務的一部分,所以我不能用CSS改變顏色,到目前爲止我們只能使用HTML和JavaScript。這不是整個任務,以防有人認爲我想作弊,這是我被困住的部分。在導航器在POST方法刷新了HTML網站之後,我不能讓div保持黃色。

謝謝!

+1

使用cookie保存div的顏色並在頁面加載時設置它 – Musa 2012-07-26 05:34:52

+0

通常會有一些服務器端代碼知道它是初始頁面請求還是提交(沒有某種服務器端處理表單提交是毫無意義的)。假設你必須這樣做,所有客戶端的Musa的建議都可以工作,或者一個對初學者來說可能更簡單的方法是在查詢字符串中添加一些內容。 – nnnnnn 2012-07-26 05:44:54

+0

@Carlos Vargas,爲什麼你需要在發佈表單之前改變'div#courselist'的顏色(以及結果是重新加載頁面)?我不明白。無論如何,你可以這樣做:1)不要用'onsubmit'事件提交表單(簡單地從'changeColor()'返回'false'); 2)在服務器端改變'div#courselist'的顏色:在'changeColor()'內改變爲html格式,將' 2012-07-26 06:16:00

回答

1

當您提交表單時,它會轉到action=""中指定的下一頁。因此,當你點擊提交按鈕時,它會改變顏色,然後加載下一頁。由於缺少在action=""中指定的頁面,它將重新加載相同的頁面,使其變爲黃色,然後刷新。

這是您可能要查找的內容。您可以使用AJAX將信息提交給POST,而無需實際加載其他頁面。

0

您可以將其分開,以便只有在符合其他條件時纔打印出表格。使用一個名爲$ output_form的變量(或者你想要命名的變量)並將其設置爲false,然後讓代碼在發送POST之前打印出一件事情,並在POST之後發送一些東西。下面是一些代碼,我完成了一小會兒前一個真正的精簡版,可能會幫助你看到你可以做什麼:

<?php 

if(isset($_POST['Submit'])){ 

{SOME CODE HERE} 

     $output_form = true; 
    } 

} 
else{ 
    $output_form = true; 
} 

if (!$output_form){ 
    {SOME CODE HERE} 
} 
else{ 
    {OTHER STUFF HERE} 
    $output_form = true; 

    mysqli_close($dbc); 
} 
} 

if ($output_form){ 
?> 


<form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>"> 
+0

假設OP使用PHP,儘管在問題中沒有提及任何地方... – nnnnnn 2012-07-26 05:48:35

+0

hhaha,dang,很好的捕獲,完全沒有考慮過那個部分...... – BillyNair 2012-07-26 05:51:50

+0

儘管如此,使用_some_ server-方面的語言是適當的。 – nnnnnn 2012-07-26 05:53:29

1

有三種方式來實現你的目標。

  1. 使用AJAX提交信息,使網頁不刷新,並且狀態remain.Or你可以像下面,有作爲阿賈克斯同樣的效果:

    < iframe的名字= 「myIfr」 風格= 「顯示:無」> </IFRAME> <形式方法= 「POST」 目標= 「myIfr」> ... </FORM>

  2. 改變的 「 」行動「,」,在url中記錄狀態,如下所示:「mypage.php?status = 1」,刷新頁面後,可以得到t他從url的狀態。

  3. 使用Cookie。我認爲這不是一個好主意。

0

嗨,大家好,我終於解決了我的問題。 我必須在我的changeColor()函數中返回false,並且網站將更改顏色,但不會自行刷新。我喜歡使用cookie的方法。

感謝您的幫助,我無法使用AJAX或PHP,因爲他們還沒有教會我們。