2012-07-26 75 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,因为他们还没有教会我们。