Auf Knopf klicken Sie den Knopf andere Aufgabe (HTML)

-1

Jetzt in meiner Seite ich ein dynamisches Raster-Boxen sind da und in jeder Box ist ein Knopf da .. mein Motiv ist onclick o die Taste jede Taste führen eine andere Aufgabe aber In meinem Code führt jeder Knopf die gleiche Aufgabe aus. und die zweite Sache ist, dass, wie kann ich die dynamische ID von Tasten jetzt hier meinen Code generieren:Auf Knopf klicken Sie den Knopf andere Aufgabe (HTML)

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<title>Digital Menu</title> 
    <meta name="description" content=""> 
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <link rel="stylesheet" href="style.css"> 
<link rel="stylesheet" href="style1.css"> 

    <title>Page Title</title> 
    </head> 
    <body> 

<div class="banner"> 
    <div class="header"> 
<div class="header-inner container clear"> 
<a class="logo" href="#"><span class="sr">Lambda Logo</span></a>  
    <div class="navigation"> 
    <ul class="navigation-menu">   
     <li class="navigation-item"><a href="new_orders.php">New Orders</a> 
    </li> 
     <li class="navigation-item"><a href="#open_orders">Open Orders</a> 
    </li> 
     <li class="navigation-item"><a href="#complete_orders">Complete 
    Orders</a></li>   
    </ul>    
    </div> 
    <ul> 
    <h1>open orders</h1> 
    </ul>  
</div> 
</div> 


<?php 

    include("connect.php"); 
    $query="SELECT * FROM `orders`"; 
    $filter_Result=mysqli_query($con,$query); 
    while($row = mysqli_fetch_array($filter_Result)){ 




     echo "<div class='block'>"; 

     echo "<div class='boxed'>"; 

echo "<div id='container'>"; 


    echo "<td>" . $row['id'] . "</td>" ."<br>"; 
    echo "<td>" . $row['status'] . "</td>"."<br>"; 
    echo "<td>" . $row['created_date'] . "</td>"."<br>"; 
    echo "<td>" . $row['uid'] . "</td>"."<br>"."<br>"."<br>"."<br>"; 
    echo "<button class='button' style='vertical-align:middle' id='demo' 
    onclick='myFunction()'><span>click Me</span>"; 
echo "</button>"; 



echo "</div>"; 


     echo "</div>"; 

    echo "</div>"; 


    } 

     ?> 


    <script type="text/javascript"> 
    function myFunction() { 
    document.getElementById('demo').innerHTML = 'Hello World'; 
    } 
    </script> 


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

Quelle

2016-05-23 techDigi

Sie sollten eindeutigen Wert mit Ihrer ID und Funktionsparametern übergeben. Verweisen Sie diesen Code. Dies wird eine eindeutige ID für jede Schaltfläche festlegen und diese eindeutige ID als Parameter in der Funktion tragen. Die Funktion zeigt also die Nachricht 'Hello World' mit der ID an.

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>Digital Menu</title> 
    <meta name="description" content=""> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <link rel="stylesheet" href="style.css"> 
    <link rel="stylesheet" href="style1.css"> 
    <title>Page Title</title> 
</head> 
<body> 
<div class="banner"> 
    <div class="header"> 
    <div class="header-inner container clear"> 
     <a class="logo" href="#"><span class="sr">Lambda Logo</span></a>  
     <div class="navigation"> 
      <ul class="navigation-menu">   
      <li class="navigation-item"><a href="new_orders.php">New Orders</a></li> 
      <li class="navigation-item"><a href="#open_orders">Open Orders</a></li> 
      <li class="navigation-item"><a href="#complete_orders">Complete Orders</a></li>   
      </ul>    
     </div> 
     <ul><h1>open orders</h1></ul>  
    </div> 
    </div> 
<?php 
    include("connect.php"); 
    $query="SELECT * FROM `orders`"; 
    $filter_Result=mysqli_query($con,$query); 
    $div = ''; 

    while($row = mysqli_fetch_array($filter_Result)){ 
     $div .= "<div class='block'><div class='boxed'><div id='container'>"; 
     $div .= "<td>" . $row['id'] . "</td>" ."<br>"; 
     $div .= "<td>" . $row['status'] . "</td>"."<br>"; 
     $div .= "<td>" . $row['created_date'] . "</td>"."<br>"; 
     $div .= "<td>" . $row['uid'] . "</td>"."<br>"."<br>"."<br>"."<br>"; 
     $div .= "<button class='button' style='vertical-align:middle' id='demo" . $row['id'] . "' onclick='myFunction(\"" . $row['id'] . "\")'><span>click Me</span>"; 
     $div .= "</button></div></div></div>"; 
    } 

    echo $div; 
?> 
<script type="text/javascript"> 
    function myFunction(id) { 
    document.getElementById('demo').innerHTML = 'Hello World' + id; 
    } 
</script> 
</div> 
</body> 
</html>

Nun, wenn Sie andere Aktion für jede Taste durchführen möchten, dann können Sie die entsprechende Aktion mit wenn oder Schalter Zustand in der Funktion schreiben.

Für zB:

function myFunction(id) { 
    if(id == 1) { 
    document.getElementById('demo').innerHTML = 'First Button clicked'; 
    } else if(id == 1) { 
    document.getElementById('demo').innerHTML = 'Second Button clicked'; 
    } 
}

Quelle

2016-05-23 11:10:34 Karthikeyani

Auf Knopf klicken Sie den Knopf andere Aufgabe (HTML)

Antwort

Verwandte Themen