Изменение цвета div на основе выходных данных цикла for

#javascript #php #html #css

#javascript #php #HTML #css

Вопрос:

Как мне преобразовать вывод приведенного ниже кода в div s вместо echo «Вкл.» или «Выкл.»?

Я также хочу div , чтобы у s был цвет фона green , если узел есть ON , и фон red , если узел есть OFF :

 <html>
<body>

<?php
for ($ipa=65; $ipa <= 72; $ipa  ){
   $ip = "10.32.12.".$ipa;
   $ping_output=array();
   exec ("ping -n 1 -w 1 $ip 2>amp;1", $ping_output, $return_val);
   //echo $ip." -> ".$return_val."<br/>".implode('<br/>',$ping_output).'<br/>';

if(stripos($ping_output[2],"TTL")!==false) {
     echo $ip." is On <br/>";
   } else if(stripos($ping_output[2],"unreachable")!==false){
     echo $ip." is unreachable <br/>";
   } else if(stripos($ping_output[2],"request")!==false){
     echo $ip." is Off <br/>";
   }
}
?>
</body>
</html>
  

Комментарии:

1. Я не понимаю связи между вашими 2 кодами

2. Где вы вызываете php-код? пожалуйста, приведите нам наглядный пример.

3. @lbar вы правы

Ответ №1:

вот то, что я сделал, надеюсь, это поможет вам:

серверная часть, q3.php

 <?php
$result = array();
for ($ipa=65, $i = 1; $ipa <= 72; $ipa  , $i  ){
   $ip = "10.32.12.".$ipa;
   $ping_output=array();

   exec ("ping -n 1 -w 1 $ip 2>amp;1", $ping_output, $return_val);
   //echo $ip." -> ".$return_val."<br/>".implode('<br/>',$ping_output).'<br/>';

if(stripos($ping_output[2],"TTL")!==false) {
//     echo $ip." is On <br/>";

     $result["enode".$i] = "on";
   } else if(stripos($ping_output[2],"unreachable")!==false){
//     echo $ip." is unreachable <br/>";
       $result["enode".$i] = "unreachable";
   } else if(stripos($ping_output[2],"request")!==false){
//     echo $ip." is Off <br/>";
       $result["enode".$i] = "off";
   }

}
echo json_encode($result);
?>
  

интерфейс, q3h.html

 <!DOCTYPE html>
<html>

    <head>
        <title>Node Status</title>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
        <style>
            #wrap {
                width: 100%;
                margin: auto;
            }

            div[id*="enode"] {
                display: inline-block;
                margin: 10px;
                width: 100px;
                height: 100px;
                background-color: green;
                text-align: center;
            }
        </style>
    </head>
    <body>
        <div id="wrap">
            <div id="enode1">Node1</div>
            <div id="enode2">Node2</div>
            <div id="enode3">Node3</div>
            <div id="enode4">Node4</div>
            <div id="enode5">Node5</div>
            <div id="enode6">Node6</div>
            <div id="enode7">Node7</div>
            <button>update nodes</button>
        </div>
        <script>
            $(document).ready(function () {


                $("button").click(function () {
                    $.ajax({
                        url: "q3.php",
                        dataType: 'json',
                        success: function (result) {
                            alert(result);
                            for (key in result) {
                                id = "#" key;
                                if (result[key] == "on") {
                                    $(id).css("background-color", "green");
                                }

                                if (result[key] == "unreachable") {
                                    $(id).css("background-color", "yellow");
                                }

                                if (result[key] == "off") {
                                    $(id).css("background-color", "red");
                                }
                            }


                        }});
                });
            });



        </script>
    </body>
</html>
  

итак, в принципе, это то, что вы должны сделать, не стесняйтесь и скажите мне, работает ли это для вас. 🙂

Комментарии:

1. И как я могу добиться такого же результата с большим пулом IP-подсетей, например, 192.168.1.0 / 20