PHP / HTML按钮图片更改和脚本调用

时间:2016-06-29 10:35:11

标签: javascript php html

我有一个页面,其中包含用户点击的按钮。 当点击按钮时,我需要它来更改图像并调用php脚本来保存更改。

我无法通过按钮同时执行这两项操作,它会更改图片,但不会调用php。

CODE:

<?php
$db = new PDO('mysql:host=localhost;dbname=MySettings;charset=utf8mb4', 'TestUser', '1234567890');
$db->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$db->setAttribute(PDO::ATTR_EMULATE_PREPARES, false);
try {
   $mytable = $_SESSION["SESS_myuserid"];
   if($mytable == null)
   {$url='login.php';
   echo '<META HTTP-EQUIV=REFRESH CONTENT="1; '.$url.'">';}

   $stmt = $db->prepare("SELECT * FROM ".$mytable);
   $stmt->execute();
    $result = $stmt->fetchAll(PDO::FETCH_ASSOC);

    $conn = null;
    echo'<script>';
    $count = count($result);
    for ($i = 0; $i < $count; $i++) {
        $TheId = $result[$i]['Id'];
        $TheFunction = $result[$i]['TheFunction'];
        $TheSetting = $result[$i]['TheSetting'];
        if ($TheSetting == "0"){
            echo 'var newsrc'.$TheId.' = "on.jpg";';
        }
        else{
            echo 'var newsrc'.$TheId.' = "off.jpg";';
        }

        echo 'function changeImage'.$TheId.'() {';
        echo 'if ( newsrc'.$TheId.' == "off.jpg" ) {';
        echo "document.getElementById('pic".$TheId."').src = '/images/Boff.png';";

        echo "$('#newCode').load('Monitor.php?id=".$TheId."&Table=".$mytable."');";
        echo 'newsrc'.$TheId.'  = "on.jpg";';
        echo '}';
        echo 'else {';
        echo "document.getElementById('pic".$TheId."').src = '/images/Bon.png';";

        echo "$('#newCode').load('Monitor.php?id=".$TheId."&Table=".$mytable."');";
        echo 'newsrc'.$TheId.'  = "off.jpg";';
        echo '}';


        echo '}';
    }
        echo'</script>';


    $myLeft=0;
    $myTop=0;
    $myRow=0;

    for ($i = 0; $i < $count; $i++) {
        $TheId = $result[$i]['Id'];
        $TheFunction = $result[$i]['TheFunction'];
        $TheSetting = $result[$i]['TheSetting'];

        if ($TheSetting == "0"){
            $ThePic = "images/Boff.png";
        }
        else{
            $ThePic = "images/Bon.png";
        }
        echo '<div>';
        echo '<a href="#" onClick=changeImage'.$TheId.'()><img src="'.$ThePic.'" alt="" id="pic'.$TheId.'" style="position:absolute;left:'.$myLeft.'px;top:'.$myTop.'px;width:63px;height:30px;"> </a>';
        echo '</div>';
        $myTop=$myTop + 30;
        $myRow=$myRow + 1;
        if ($myRow == 12){
            $myRow=0;
            $myTop=0;
            if ($myLeft == 0){
                $myLeft = 292;
            }
            else {
                $myLeft = 615;
            }
        }
    }
}
catch(PDOException $e) {
    $url='login.php';
    echo '<META HTTP-EQUIV=REFRESH CONTENT="1; '.$url.'">';
}
?> 

1 个答案:

答案 0 :(得分:0)

修正: 更改了脚本功能。添加了一个隐藏的div来调用加载php,它什么也不输出,所以保持不可见。

    echo'<script>';
    $count = count($result);
    for ($i = 0; $i < $count; $i++) {
        $TheId = $result[$i]['Id'];
        $TheFunction = $result[$i]['TheFunction'];
        $TheSetting = $result[$i]['TheSetting'];
        if ($TheSetting == "0"){
            echo 'var newsrc'.$TheId.' = "on.jpg";';
        }
        else{
            echo 'var newsrc'.$TheId.' = "off.jpg";';
        }

        echo 'function changeImage'.$TheId.'() {';
        echo 'if ( newsrc'.$TheId.' == "off.jpg" ) {';
        echo "document.getElementById('pic".$TheId."').src = '/images/Boff.png';";
        echo 'newsrc'.$TheId.'  = "on.jpg";';
        echo '}';
        echo 'else {';
        echo "document.getElementById('pic".$TheId."').src = '/images/Bon.png';";
        echo 'newsrc'.$TheId.'  = "off.jpg";';
        echo '}';
        echo'    $("#HtmlConvo").load("Monitor.php?id='.$TheId.'&Table='.$mytable.'");';
        echo '}';
        }
    echo'</script>';