將輸入發布到 HTML 內部的 PHP<div id="text_translate"><p> 我對 HTML、PHP 和 javascript 還是很陌生。 所以我正在開發一個簡單的音樂搜索網站。 所以基本上在輸入關鍵字后，我的 web 將顯示可能的結果列表，然后單擊結果會將我重定向到音樂播放器並開始播放音樂。</p><p> 這是我的 HTML 文件： </p><p></p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false"><div class="snippet-code"><pre class="snippet-code-html lang-html prettyprint-override"> <div class="container"> <div class="row"> <h1>Search Results</h1> <!-- BEGIN SEARCH RESULT --> <div class="col-md-12"> <div class="grid search"> <div class="grid-body"> <div class="row"> <div class="table-responsive"> <table class="table table-hover"> <tbody id="mytable"> </tbody> </table> </div> </div> </div> </div> </div> </div> </div></pre></div></div><p></p><p> 我將搜索結果插入到帶有 javascript 的表中</p><p></p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false"><div class="snippet-code"><pre class="snippet-code-js lang-js prettyprint-override"> <script> window.onload= function () { var results = <?php echo json_encode($result_array); ?>; for (i=1;i<=results.length;i++){ document.getElementById("mytable").innerHTML += '<tr action="get_music.php" method="post"><td class= "number text-center">' + i +'</td> <td><input type="hidden" name="name" value='+results[i-1][0]+'/></td></tr>'; } } </sript></pre></div></div><p></p><p> 我的問題是，每當我點擊一個結果（或具體的表格行）時，我都不會被重定向到 get_music.php 並且我也無法將我的輸入發布到 get_music.php 文件中。 我知道我的代碼一團糟，但請幫忙！ 謝謝！</p><p> 更新 - 添加了一些圖片只是為了更清楚地描述它！ <a href="https://i.stack.imgur.com/Cd5z5.png" rel="nofollow noreferrer">照片鏈接</a>所以，我搜索了一個關鍵字並得到了多個結果，我希望從我點擊的結果中傳遞 3 個值（名稱、專輯、藝術家）到 get_music.php</p><p> 更新 - 它有效！ 感謝 Agustin Mita 的幫助！ 所以這是我的最終代碼</p><p></p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false"><div class="snippet-code"><pre class="snippet-code-js lang-js prettyprint-override"> <script> window.onload= function() { getDataPHP(); } function getDataPHP(){ var results = <?php echo json_encode($result_array); ?>; renderView(results); } function renderView(results){ var data = ""; for (i=0;i<results.length;i++){ data += '<tr>'; data += '<td class="number text-center">' + (i+1) + '</td>'; data += '<td class="image" align="left"><img src="https://discussions.apple.com/content/attachment/881765040" alt=""></td>'; data += '<td class="product"><strong>'+results[i][0]+'</strong><br>'+results[i][1]+'<br>'+results[i][2]+'</td>'; data += '<td><form method="post" action="get_music.php">'; data += '<input type="hidden" value="'+results[i][0]+'" name="name" />'; data += '<input type="hidden" value="'+results[i][1]+'" name="album" />'; data += '<input type="hidden" value="'+results[i][2]+'" name="author" />'; data += '<br><input style="float: right;" type="submit" value="Play music" />'; data += '</form></td>'; data += '</tr>'; } document.getElementById('mytable').innerHTML += data; } </script></pre></div></div><p></p></div><table></table>
[英]Posting Inputs to PHP inside HTML <table>
問題描述
我對 HTML、PHP 和 javascript 還是很陌生。 所以我正在開發一個簡單的音樂搜索網站。 所以基本上在輸入關鍵字后，我的 web 將顯示可能的結果列表，然后單擊結果會將我重定向到音樂播放器並開始播放音樂。
這是我的 HTML 文件：
<div class="container"> <div class="row"> <h1>Search Results</h1> <!-- BEGIN SEARCH RESULT --> <div class="col-md-12"> <div class="grid search"> <div class="grid-body"> <div class="row"> <div class="table-responsive"> <table class="table table-hover"> <tbody id="mytable"> </tbody> </table> </div> </div> </div> </div> </div> </div> </div>
我將搜索結果插入到帶有 javascript 的表中
<script> window.onload= function () { var results = <?php echo json_encode($result_array); ?>; for (i=1;i<=results.length;i++){ document.getElementById("mytable").innerHTML += '<tr action="get_music.php" method="post"><td class= "number text-center">' + i +'</td> <td><input type="hidden" name="name" value='+results[i-1][0]+'/></td></tr>'; } } </sript>
我的問題是，每當我點擊一個結果（或具體的表格行）時，我都不會被重定向到 get_music.php 並且我也無法將我的輸入發布到 get_music.php 文件中。 我知道我的代碼一團糟，但請幫忙！ 謝謝！
更新 - 添加了一些圖片只是為了更清楚地描述它！ 照片鏈接所以，我搜索了一個關鍵字並得到了多個結果，我希望從我點擊的結果中傳遞 3 個值（名稱、專輯、藝術家）到 get_music.php
更新 - 它有效！ 感謝 Agustin Mita 的幫助！ 所以這是我的最終代碼
<script> window.onload= function() { getDataPHP(); } function getDataPHP(){ var results = <?php echo json_encode($result_array); ?>; renderView(results); } function renderView(results){ var data = ""; for (i=0;i<results.length;i++){ data += '<tr>'; data += '<td class="number text-center">' + (i+1) + '</td>'; data += '<td class="image" align="left"><img src="https://discussions.apple.com/content/attachment/881765040" alt=""></td>'; data += '<td class="product"><strong>'+results[i][0]+'</strong><br>'+results[i][1]+'<br>'+results[i][2]+'</td>'; data += '<td><form method="post" action="get_music.php">'; data += '<input type="hidden" value="'+results[i][0]+'" name="name" />'; data += '<input type="hidden" value="'+results[i][1]+'" name="album" />'; data += '<input type="hidden" value="'+results[i][2]+'" name="author" />'; data += '<br><input style="float: right;" type="submit" value="Play music" />'; data += '</form></td>'; data += '</tr>'; } document.getElementById('mytable').innerHTML += data; } </script>
2 個解決方案
解決方案1
0 2021-05-30 13:03:59
如果要發布它，它必須在表單標簽內。 您還應該添加一個提交按鈕。 如果你想點擊 go 的行，你可以使用帶有 a 標簽的 get 方法。 如果你想點線發帖，建議你看ajax。
解決方案2
0 已采納 2021-05-30 15:14:36
您可以在表格標記之前添加表單標記：
<form id="myForm" method="POST" action="get_music.php">
<table class="table table-hover">
<tbody id="mytable">
</tbody>
</table>
</form>
在 javascript 上可以使用 onclick 提交：
data += '<td onclick="document.getElementById(\'myForm\').submit()" > Any text</td>';
示例：注意：在 php 頁面上，您可以使用$_POST function 檢索數據
window.onload= function() { getData(); } function getData(){ fetch("https://jsonplaceholder.typicode.com/todos").then(response => response.json()).then((json) => renderView(json)); } function getDataPHP(){ //var results = <?php echo json_encode($result_array); ?>; //renderView(results); } function renderView(results){ var data = ""; for (i=0;i<results.length;i++){ data += '<tr>'; data += '<td onclick="document.getElementById(\'myForm\').submit()" class= "number text-center">'; data += results[i].id; data += '</td>'; data += '<td><input type="submit" value="Go '+results[i].id+'" name="'+results[i].id+'" /></td>'; data += '</tr>'; } document.getElementById('mytable').innerHTML += data; }
td { cursor: pointer; }
<div class="container"> <div class="row"> <h1 id="titleBig">Search Results</h1> <.-- BEGIN SEARCH RESULT --> <div class="col-md-12"> <div class="grid search"> <div class="grid-body"> <div class="row"> <div class="table-responsive"> <form id="myForm" method="POST" action="get_music.php"> <table class="table table-hover"> <tbody id="mytable"> </tbody> </table> </form> </div> </div> </div> </div> </div> </div> </div>
更新
@KuanyuChwn 您需要一個具有不同名稱屬性和提交按鈕的 3 個輸入字段
data += '<tr>';
data += '<td onclick="document.getElementById(\'myForm\').submit()" class= "number text-center">';
data += results[i].id;
data += '</td>';
data += '<td><input type="text" value="'+results[i].id+'" name="valueA" /></td>';
data += '<td><input type="text" value="'+results[i].title+'" name="valueB" /></td>';
data += '<td><input type="text" value="'+results[i].title+'-valueC'+'" name="valueC" /></td>';
data += '<td><input type="submit" value="Send" /></td>';
data += '</tr>';
如何在php中對表格進行排序並在發布PHP后保持表格排序
[英]How to sort a table in php and keep table sorted after Posting the PHP
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.