На кнопке нажмите кнопку выполнить другую задачу (HTML)

-1

Теперь на моей странице я устанавливаю динамические ячейки сетки там, и в каждом окне есть кнопка .. мой мотив включен, кнопка на каждой кнопке выполняет другую задачу, но в моем коде каждая кнопка выполняет аналогичную задачу. и второе дело в том, что как я могу генерировать динамический идентификатор кнопки теперь вот мой код:На кнопке нажмите кнопку выполнить другую задачу (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>

источник

2016-05-23 techDigi

Вы должны пройти уникальное значение с ID и параметра функции. См. Этот код. Это устанавливает уникальный идентификатор для каждой кнопки и передает этот уникальный идентификатор в качестве параметра в функции. Таким образом, функция отобразит сообщение «Hello World» с идентификатором.

<!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>

Теперь, если вы хотите, чтобы выполнить различные действия для каждой кнопки, то вы можете написать соответствующее действие с помощью если или переключателя условия в функции.

Для например:

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

источник

2016-05-23 11:10:34 Karthikeyani

На кнопке нажмите кнопку выполнить другую задачу (HTML)

ответ

Смежные вопросы