I want to use php in html at first, but I found the way

Question

0

Asked: June 16, 20262026-06-16T17:46:49+00:00 2026-06-16T17:46:49+00:00

I want to use php in html at first, but I found the way

0

I want to use php in html at first, but I found the way is creates .htaccess file and does not work, so I use php to code the same html then do task in php.
The reason why I want to use php in html is that I want to store data in database per 10 seconds.
But my html use css to design the layout, and when I use same code in php, the .php file can not works as html in IE browser. However, I use firefox and crome browser, it works fine. I recently use IE6, and I am not sure it is related to IE browser or not…
My code in html originally is:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Welcom to My CAM</title>
<style>
#extend{
display: none; //預設為隱藏
}
#close{
display: block; //預設為顯示
}
#extend2{
display: none; //預設為隱藏
}
#close2{
display: block; //預設為顯示
}
#extend3{
display: none; //預設為隱藏
}
#close3{
display: block; //預設為顯示
}
body {
    background-color: #CC6633;
}
body,td,th {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}
</style>
<script type="text/javascript">
//第一個參數為欲顯示的區塊，第二個參數為欲隱藏的區塊
function exchange(show,hidden){
if(document.getElementById(show).style.display = 'none'){
document.getElementById(show).style.display = 'block';
document.getElementById(hidden).style.display = 'none';
}
}
function change1_1(){
    document.getElementById("img1_1").src="images/btn1_1c.png";
    document.getElementById("img1_2").src="images/btn1_2.png";
    document.getElementById("img1_3").src="images/btn1_3.png";
    document.getElementById("img2_1").src="images/btn2_1.png";
    document.getElementById("img2_2").src="images/btn2_2.png";
    document.getElementById("img2_3").src="images/btn2_3.png";
    document.getElementById("img3_1").src="images/btn3_1.png";
    document.getElementById("img3_2").src="images/btn3_2.png";
}
function change1_2(){
    document.getElementById("img1_1").src="images/btn1_1.png";
    document.getElementById("img1_2").src="images/btn1_2c.png";
    document.getElementById("img1_3").src="images/btn1_3.png";
    document.getElementById("img2_1").src="images/btn2_1.png";
    document.getElementById("img2_2").src="images/btn2_2.png";
    document.getElementById("img2_3").src="images/btn2_3.png";
    document.getElementById("img3_1").src="images/btn3_1.png";
    document.getElementById("img3_2").src="images/btn3_2.png";
}
function change1_3(){
    document.getElementById("img1_1").src="images/btn1_1.png";
    document.getElementById("img1_2").src="images/btn1_2.png";
    document.getElementById("img1_3").src="images/btn1_3c.png";
    document.getElementById("img2_1").src="images/btn2_1.png";
    document.getElementById("img2_2").src="images/btn2_2.png";
    document.getElementById("img2_3").src="images/btn2_3.png";
    document.getElementById("img3_1").src="images/btn3_1.png";
    document.getElementById("img3_2").src="images/btn3_2.png";
}
function change2_1(){
    document.getElementById("img1_1").src="images/btn1_1.png";
    document.getElementById("img1_2").src="images/btn1_2.png";
    document.getElementById("img1_3").src="images/btn1_3.png";
    document.getElementById("img2_1").src="images/btn2_1c.png";
    document.getElementById("img2_2").src="images/btn2_2.png";
    document.getElementById("img2_3").src="images/btn2_3.png";
    document.getElementById("img3_1").src="images/btn3_1.png";
    document.getElementById("img3_2").src="images/btn3_2.png";
}
function change2_2(){
    document.getElementById("img1_1").src="images/btn1_1.png";
    document.getElementById("img1_2").src="images/btn1_2.png";
    document.getElementById("img1_3").src="images/btn1_3.png";
    document.getElementById("img2_1").src="images/btn2_1.png";
    document.getElementById("img2_2").src="images/btn2_2c.png";
    document.getElementById("img2_3").src="images/btn2_3.png";
    document.getElementById("img3_1").src="images/btn3_1.png";
    document.getElementById("img3_2").src="images/btn3_2.png";
}
function change2_3(){
    document.getElementById("img1_1").src="images/btn1_1.png";
    document.getElementById("img1_2").src="images/btn1_2.png";
    document.getElementById("img1_3").src="images/btn1_3.png";
    document.getElementById("img2_1").src="images/btn2_1.png";
    document.getElementById("img2_2").src="images/btn2_2.png";
    document.getElementById("img2_3").src="images/btn2_3c.png";
    document.getElementById("img3_1").src="images/btn3_1.png";
    document.getElementById("img3_2").src="images/btn3_2.png";
}
function change3_1(){
    document.getElementById("img1_1").src="images/btn1_1.png";
    document.getElementById("img1_2").src="images/btn1_2.png";
    document.getElementById("img1_3").src="images/btn1_3.png";
    document.getElementById("img2_1").src="images/btn2_1.png";
    document.getElementById("img2_2").src="images/btn2_2.png";
    document.getElementById("img2_3").src="images/btn2_3.png";
    document.getElementById("img3_1").src="images/btn3_1c.png";
    document.getElementById("img3_2").src="images/btn3_2.png";
}
function change3_2(){
    document.getElementById("img1_1").src="images/btn1_1.png";
    document.getElementById("img1_2").src="images/btn1_2.png";
    document.getElementById("img1_3").src="images/btn1_3.png";
    document.getElementById("img2_1").src="images/btn2_1.png";
    document.getElementById("img2_2").src="images/btn2_2.png";
    document.getElementById("img2_3").src="images/btn2_3.png";
    document.getElementById("img3_1").src="images/btn3_1.png";
    document.getElementById("img3_2").src="images/btn3_2c.png";
}
</script>
</head>

<body>
<form id="form1">
<div id="close">
<img src="images/btn1.png" onClick="exchange('extend','close')">
<!-- 顯示 extend 同時隱藏 close -->
</div>
<div id="extend">
<img src="images/btn1.png" onClick="exchange('close','extend')">
<a href="index4.html" target="mainFrame"><img src="images/btn1_1.png" id="img1_1" align="right" Style="border:0px solid " onClick="change1_1()"/></a>
<a href="mac.php" target="mainFrame"><img src="images/btn1_2.png" id="img1_2" align="right" Style="border:0px solid " onClick="change1_2()" /></a>
<a href="ipcam.php" target="mainFrame"><img src="images/btn1_3.png" id="img1_3" align="right" Style="border:0px solid " onClick="change1_3()" /></a>
<!-- 顯示 close 同時隱藏 extend -->
</div>
<div id="close2">
<img src="images/btn2.png" onClick="exchange('extend2','close2')">
<!-- 顯示 extend 同時隱藏 close -->
</div>
<div id="extend2">
<img src="images/btn2.png" onClick="exchange('close2','extend2')">
<a href="account.php" target="mainFrame"><img src="images/btn2_1.png" id="img2_1" align="right" Style="border:0px solid " onClick="change2_1()" /></a>
<a href="actives.php" target="mainFrame"><img src="images/btn2_2.png" id="img2_2" align="right" Style="border:0px solid " onClick="change2_2()" /></a>
<a href="index4.html" target="mainFrame"><img src="images/btn2_3.png" id="img2_3" align="right" Style="border:0px solid " onClick="change2_3()" /></a>
<!-- 顯示 close 同時隱藏 extend -->
</div>
<div id="close3">
<img src="images/btn3.png" onClick="exchange('extend3','close3')">
<!-- 顯示 extend 同時隱藏 close -->
</div>
<div id="extend3">
<img src="images/btn3.png" onClick="exchange('close3','extend3')">
<a href="index4.html" target="mainFrame"><img src="images/btn3_1.png" id="img3_1" align="right" Style="border:0px solid " onClick="change3_1()" /></a>
<a href="index4.html" target="mainFrame"><img src="images/btn3_2.png" id="img3_2" align="right" Style="border:0px solid " onClick="change3_2()" /></a>
<!-- 顯示 close 同時隱藏 extend -->
</div>
</form>
</body>
</html>

Just to use css to do menu that can be hide/visible, it runs in IE is successfully.
And to combine with php, my php code is:

   <?php 
  //--------------------------------------------------------------------------
  // 1) Connect to mysql database
  //--------------------------------------------------------------------------
  include "./databases.php";
  //echo $_POST["selectmenu"]."test";
  //--------------------------------------------------------------------------
  // 2) Query database for data
  //--------------------------------------------------------------------------

  $result = mysql_query('select * from user ;');        //;needed!
   if(!$result){
        echo 'Execute SQL failed : ' . mysql_error();
        exit;
   }
   ?>

<html>
<head>
<meta charset="utf-8" />
<title></title>
<style>
#extend{
display: none; //預設為隱藏
}
#close{
display: block; //預設為顯示
}
#extend2{
display: none; //預設為隱藏
}
#close2{
display: block; //預設為顯示
}
#extend3{
display: none; //預設為隱藏
}
#close3{
display: block; //預設為顯示
}
body {
    background-color: #CC6633;
}
body,td,th {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}
</style>
<script type="text/javascript">
//第一個參數為欲顯示的區塊，第二個參數為欲隱藏的區塊
function exchange(show,hidden){
if(document.getElementById(show).style.display = 'none'){
document.getElementById(show).style.display = 'block';
document.getElementById(hidden).style.display = 'none';
}
}
function change1_1(){
    document.getElementById("img1_1").src="images/btn1_1c.png";
    document.getElementById("img1_2").src="images/btn1_2.png";
    document.getElementById("img1_3").src="images/btn1_3.png";
    document.getElementById("img2_1").src="images/btn2_1.png";
    document.getElementById("img2_2").src="images/btn2_2.png";
    document.getElementById("img2_3").src="images/btn2_3.png";
    document.getElementById("img3_1").src="images/btn3_1.png";
    document.getElementById("img3_2").src="images/btn3_2.png";
}
function change1_2(){
    document.getElementById("img1_1").src="images/btn1_1.png";
    document.getElementById("img1_2").src="images/btn1_2c.png";
    document.getElementById("img1_3").src="images/btn1_3.png";
    document.getElementById("img2_1").src="images/btn2_1.png";
    document.getElementById("img2_2").src="images/btn2_2.png";
    document.getElementById("img2_3").src="images/btn2_3.png";
    document.getElementById("img3_1").src="images/btn3_1.png";
    document.getElementById("img3_2").src="images/btn3_2.png";
}
function change1_3(){
    document.getElementById("img1_1").src="images/btn1_1.png";
    document.getElementById("img1_2").src="images/btn1_2.png";
    document.getElementById("img1_3").src="images/btn1_3c.png";
    document.getElementById("img2_1").src="images/btn2_1.png";
    document.getElementById("img2_2").src="images/btn2_2.png";
    document.getElementById("img2_3").src="images/btn2_3.png";
    document.getElementById("img3_1").src="images/btn3_1.png";
    document.getElementById("img3_2").src="images/btn3_2.png";
}
function change2_1(){
    document.getElementById("img1_1").src="images/btn1_1.png";
    document.getElementById("img1_2").src="images/btn1_2.png";
    document.getElementById("img1_3").src="images/btn1_3.png";
    document.getElementById("img2_1").src="images/btn2_1c.png";
    document.getElementById("img2_2").src="images/btn2_2.png";
    document.getElementById("img2_3").src="images/btn2_3.png";
    document.getElementById("img3_1").src="images/btn3_1.png";
    document.getElementById("img3_2").src="images/btn3_2.png";
}
function change2_2(){
    document.getElementById("img1_1").src="images/btn1_1.png";
    document.getElementById("img1_2").src="images/btn1_2.png";
    document.getElementById("img1_3").src="images/btn1_3.png";
    document.getElementById("img2_1").src="images/btn2_1.png";
    document.getElementById("img2_2").src="images/btn2_2c.png";
    document.getElementById("img2_3").src="images/btn2_3.png";
    document.getElementById("img3_1").src="images/btn3_1.png";
    document.getElementById("img3_2").src="images/btn3_2.png";
}
function change2_3(){
    document.getElementById("img1_1").src="images/btn1_1.png";
    document.getElementById("img1_2").src="images/btn1_2.png";
    document.getElementById("img1_3").src="images/btn1_3.png";
    document.getElementById("img2_1").src="images/btn2_1.png";
    document.getElementById("img2_2").src="images/btn2_2.png";
    document.getElementById("img2_3").src="images/btn2_3c.png";
    document.getElementById("img3_1").src="images/btn3_1.png";
    document.getElementById("img3_2").src="images/btn3_2.png";
}
function change3_1(){
    document.getElementById("img1_1").src="images/btn1_1.png";
    document.getElementById("img1_2").src="images/btn1_2.png";
    document.getElementById("img1_3").src="images/btn1_3.png";
    document.getElementById("img2_1").src="images/btn2_1.png";
    document.getElementById("img2_2").src="images/btn2_2.png";
    document.getElementById("img2_3").src="images/btn2_3.png";
    document.getElementById("img3_1").src="images/btn3_1c.png";
    document.getElementById("img3_2").src="images/btn3_2.png";
}
function change3_2(){
    document.getElementById("img1_1").src="images/btn1_1.png";
    document.getElementById("img1_2").src="images/btn1_2.png";
    document.getElementById("img1_3").src="images/btn1_3.png";
    document.getElementById("img2_1").src="images/btn2_1.png";
    document.getElementById("img2_2").src="images/btn2_2.png";
    document.getElementById("img2_3").src="images/btn2_3.png";
    document.getElementById("img3_1").src="images/btn3_1.png";
    document.getElementById("img3_2").src="images/btn3_2c.png";
}
</script>
</head>

<body>  
<form id="form1">
<div id="close">
<img src="images/btn1.png" onClick="exchange('extend','close')">
<!-- 顯示 extend 同時隱藏 close -->
</div>
<div id="extend">
<img src="images/btn1.png" onClick="exchange('close','extend')">
<a href="index4.html" target="mainFrame"><img src="images/btn1_1.png" id="img1_1" align="right" Style="border:0px solid " onClick="change1_1()"/></a>
<a href="mac.php" target="mainFrame"><img src="images/btn1_2.png" id="img1_2" align="right" Style="border:0px solid " onClick="change1_2()" /></a>
<a href="ipcam.php" target="mainFrame"><img src="images/btn1_3.png" id="img1_3" align="right" Style="border:0px solid " onClick="change1_3()" /></a>
<!-- 顯示 close 同時隱藏 extend -->
</div>
<div id="close2">
<img src="images/btn2.png" onClick="exchange('extend2','close2')">
<!-- 顯示 extend 同時隱藏 close -->
</div>
<div id="extend2">
<img src="images/btn2.png" onClick="exchange('close2','extend2')">
<a href="account.php" target="mainFrame"><img src="images/btn2_1.png" id="img2_1" align="right" Style="border:0px solid " onClick="change2_1()" /></a>
<a href="actives.php" target="mainFrame"><img src="images/btn2_2.png" id="img2_2" align="right" Style="border:0px solid " onClick="change2_2()" /></a>
<a href="index4.html" target="mainFrame"><img src="images/btn2_3.png" id="img2_3" align="right" Style="border:0px solid " onClick="change2_3()" /></a>
<!-- 顯示 close 同時隱藏 extend -->
</div>
<div id="close3">
<img src="images/btn3.png" onClick="exchange('extend3','close3')">
<!-- 顯示 extend 同時隱藏 close -->
</div>
<div id="extend3">
<img src="images/btn3.png" onClick="exchange('close3','extend3')">
<a href="index4.html" target="mainFrame"><img src="images/btn3_1.png" id="img3_1" align="right" Style="border:0px solid " onClick="change3_1()" /></a>
<a href="index4.html" target="mainFrame"><img src="images/btn3_2.png" id="img3_2" align="right" Style="border:0px solid " onClick="change3_2()" /></a>
<!-- 顯示 close 同時隱藏 extend -->
</div>
</form>
<?
        header("Refresh:10");
            $handle=fopen("userfile.txt","w+");
            $content="";
            if($handle)
            {
                while( $rows = mysql_fetch_array($result)){

                    $userId = $rows[userId];
                    $userMail = $rows[userMail];

                    $content.=$userId.";".$userMail.";";    

                }

                $num=fwrite($handle, $content);
                fclose($handle);
                #echo $num;
            }
            else
            {
                echo "There is something wrong.";
            }
?>
</body>         
</html>

It connects to database in the beginning, and in <body> part, it do the php code to store data.

It can store data well, but the UI in IE can not work.

What’s wrong with it?

Any help appreciate!

Report

Leave an answer
Cancel reply

You must login to add an answer.

Need An Account,

1 Answer

Editorial Team · Answer 1 · 2026-06-16T17:46:50+00:00

Editorial Team

2026-06-16T17:46:50+00:00Added an answer on June 16, 2026 at 5:46 pm

You need this

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">

0

Reply
Share
Share

- Report

Sign Up

Sign In

Forgot Password

The Archive Base Latest Questions

I want to use php in html at first, but I found the way

Leave an answerCancel reply

1 Answer

Leave an answer
Cancel reply