如何在提交按钮的javascript中更改标签颜色

时间:2016-12-12 18:02:08

标签: jquery html5 twitter-bootstrap

Hello Friend我的代码有问题, 在这个代码中我希望当我按下保存按钮然后'Hello PHP'打印和FIRST NAME的标签颜色改变但是它不起作用,当我把提交按钮类型然后它显示'Hello PHP'并且标签颜色不改变当我按钮类型中的按钮然后标记颜色更改但不打印'hello PHP',我想要两个保存按钮单击,请帮我从这段代码中删除

这是我的代码:

<?php
//php code 
$isSaveDisabled=true;
$isCreateDisabled=false;

if(isset($_POST['save_button']))
{
echo 'Hello PHP';
}

if(isset($_POST['create_button']))
{
$isSaveDisabled=false;
}
?>
// BootStrap Code
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>My New PHP CODE</title>

<link rel="stylesheet" href="bootStrap/css/bootstrap.css"/>
<link rel="stylesheet" href="bootStrap/css/bootstrap.min.css"/>

<script type="text/javascript">
function myFunction() {
document.getElementById("myID").style.color = "#ff0000";
}
</script>

</head>
<body>
<div class="container jumbotron text-center">

    <form action="" method="POST" class="form-inline">
        <div class="form-group">
            <label for="fname" id="myID">FIRST NAME</label>
            <input type="text" name="fname" class="form-control" >
             <label for="nlame">LAST NAME</label>
            <input type="text" name="lname" class="form-control" >
        </div>
        <br><br>
            <div class="btn-group">
            <button type="submit" name="save_button" onclick="myFunction();" <?php echo $isSaveDisabled? 'disabled':'';?>>SAVE</button>
             <button type="submit" name="create_button" <?php echo $isCreateDisabled? 'disabled':''?> >CREATE</button>

        </div>
    </form>
</div>
</body>
</html>

1 个答案:

答案 0 :(得分:1)

标签在提交ckick后变色,但页面立即刷新。 您可以通过检查是否单击了“保存”按钮来为标签着色:

<?php

if($isSaveDisabled) {
  echo '<script>document.getElementById("myID").style.color = "#ff0000";</script>'
}
?>

因此您的代码将会显示:

<?php
//php code 
$isSaveDisabled=true;
$isCreateDisabled=false;

if(isset($_POST['save_button']))
{
echo 'Hello PHP';
}

if(isset($_POST['create_button']))
{
$isSaveDisabled=false;
}
?>
// BootStrap Code
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>My New PHP CODE</title>

<link rel="stylesheet" href="bootStrap/css/bootstrap.css"/>
<link rel="stylesheet" href="bootStrap/css/bootstrap.min.css"/>

<script type="text/javascript">
function myFunction() {
document.getElementById("myID").style.color = "#ff0000";
}
</script>

</head>
<body>
<div class="container jumbotron text-center">

    <form action="" method="POST" class="form-inline">
        <div class="form-group">
            <label for="fname" id="myID">FIRST NAME</label>
            <input type="text" name="fname" class="form-control" >
             <label for="nlame">LAST NAME</label>
            <input type="text" name="lname" class="form-control" >
        </div>
        <br><br>
            <div class="btn-group">
            <button type="submit" name="save_button" onclick="myFunction();" <?php echo $isSaveDisabled? 'disabled':'';?>>SAVE</button>
             <button type="submit" name="create_button" <?php echo $isCreateDisabled? 'disabled':''?> >CREATE</button>

        </div>
    </form>
</div>

<?php
  if($isSaveDisabled) {
    echo '<script>document.getElementById("myID").style.color = "#ff0000";</script>';
  }
?>
</body>
</html>