「updqte」ボタンをクリックすると、ボタンが「保存」に変わり、セルがテキストボックスになると思います。テキストボックスを編集した後、「保存」をクリックすると、結果がデータベースに送信されます。 。ボタンの変更は js で行われ、残りの部分に戻ることができません。助けていただけますか?
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type"
content="text/html;
charset=UTF-8"><title>Insert title here</title><script language="javascript" type="text/javascript">
function showtd(num) {
document.getElementById("bg"+num).style.display = "none";
document.getElementById("show"+num).style.display = "block";
}
function hidetd(num) {
document.getElementById("bg"+num).style.display = 'block';
document.getElementById("show"+num).style.display = 'none';
}
function change()
{
var tds = document.getElementsByTagName("td");
var t1 = document.getElementById("a").innerHTML;
var txt = document.createElement("input");
txt.type = "text";
txt.value = t1;
txt.id = "sort_t";
tds[29].appendChild(txt);
txt.select();
}
function mouseup(){
if (document.getElementById("sort_t") && event.srcElement.id != "sort_t")
{
var obj = document.getElementById("sort_t").parentElement;
var txtValue = document.getElementById("sort_t").value;
obj.innerText = txtValue;
}
}
</script></head><body><form><table border="1">
<?php
$db = mysql_connect('localhost','root','root');
mysql_select_db('ec',$db);
if (!$db)
{
die('Could not connect: ' . mysql_error());
}
$result = mysql_query("select * from goods");
echo "<tr><th>GoodsID</th><th>BarCode</th>
<th>GoodsName</th>
<th>Category</th>
<th>Specifications</th>
<th>Manufacturers</th>
<th>Numbers</th>
<th>Instructions</th>
<th>Pictures</th>
<th>Update</th>
<th>Delete</th></tr>";
$n = 0;while($row = mysql_fetch_array($result))
{
echo "<tr>";
echo "<td>" . $row['id'] . "</td>"; echo "<td>" . $row['barcode'] . "</td>";
echo "<td>" . $row['goods_name'] . "</td>";
echo "<td>" . $row['category'] . "</td>";
echo "<td>" . $row['specifications'] . "</td>";
echo "<td>" . $row['manufacturers'] . "</td>";
echo "<td>" . $row['number'] . "</td>";
echo "<td>" . $row['instruction'] . "</td>";
echo "<td>" . "<img src = '$row[picture_url]' style='width:80px;height=60px'/>" . "</td>";
echo "<td id='bg$n'>".
"<input id='btnshow$n' type='button' value='Update' onclick='showtd($n)'/>".
"</td>".
"<td id='show$n' style='display:none'>".
"<input id='btnclose$n' type='button' value='Save' onclick='hidetd($n)'/>".
"</td>"; echo "<td>"."<a href='delete.php?id=$row[id]'>"."Delete"."</a>"."</td>";
echo "</tr>";
++$n;
}
mysql_close($db);
?>
</table></form>
</body></html>ログイン後にコピー
ディスカッションへの返信 (解決策)
1. 保存ボタンをクリックした後にトリガーする onclick メソッドを与えます
2. ajax を使用してパラメーターをバックグラウンドに送信し、php プログラムを呼び出します
3. 次に、受け取ったコンテンツをデータベース
4. 成功または失敗した場合はページに戻ります
ここでデータを送信するには、ajax を使用する必要があります
1. 保存ボタンをクリックしたときにトリガーされる onclick メソッドを指定します
2. ajax を使用してパラメーターをバックグラウンドに送信しますそして、php プログラムを呼び出します
3. 次に、コンテンツを受信してデータベースに送信します
4. 成功または失敗した場合は、ページに戻ります
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type"
content="text/html; charset=UTF-8"><title>Insert title here</title><script language="javascript" type="text/javascript">
function showtd(num) {
document.getElementById("bg"+num).style.display = "none";
document.getElementById("show"+num).style.display = "block";
}
function hidetd(num) {
document.getElementById("bg"+num).style.display = 'block';
document.getElementById("show"+num).style.display = 'none';
}
function change()
{
var tds = document.getElementsByTagName("td");
var t1 = document.getElementById("a").innerHTML;
var txt = document.createElement("input");
txt.type = "text";
txt.value = t1;
txt.id = "sort_t";
tds[30].appendChild(txt);
txt.select();
}
function mouseup(){
if (document.getElementById("sort_t") && event.srcElement.id != "sort_t")
{
var obj = document.getElementById("sort_t").parentElement;
var txtValue = document.getElementById("sort_t").value;
obj.innerText = txtValue;
}
}
</script></head><body>
<form>
<table border="1">
<?php
$db = mysql_connect('localhost','root','root');
mysql_select_db('ec',$db);
if (!$db)
{
die('Could not connect: ' . mysql_error());
}
$result = mysql_query("select * from goods");
echo "<tr>
<th>GoodsID</th>
<th>BarCode</th>
<th>GoodsName</th>
<th>Category</th>
<th>Specifications</th>
<th>Manufacturers</th>
<th>Numbers</th>
<th>Instructions</th>
<th>Pictures</th>
<th>Update</th>
<th>Delete</th>
</tr>";
$n = 0;
while($row = mysql_fetch_array($result))
{
echo "<tr>";
echo "<td>" . $row['id'] . "</td>";
echo "<td id='a'>" . $row['barcode'] . "</td>";
echo "<td>" . $row['goods_name'] . "</td>";
echo "<td>" . $row['category'] . "</td>";
echo "<td>" . $row['specifications'] . "</td>";
echo "<td>" . $row['manufacturers'] . "</td>"; echo "<td>" . $row['number'] . "</td>";
echo "<td>" . $row['instruction'] . "</td>";
echo "<td>" . "<img src = '$row[picture_url]' style='width:80px;height=60px'/>" . "</td>";
echo "<td id='bg$n'>".
"<input id='btnshow$n' type='button' value='Update' onclick='showtd($n);change()' />".
"</td>".
"<td id='show$n' style='display:none'>".
"<input id='btnclose$n' type='button' value='Save' onclick='hidetd($n);mouseup()'/>".
"</td>";
echo "<td>"."<a href='delete.php?id=$row[id]'>"."Delete"."</a>"."</td>";
echo "</tr>";
++$n;
}
mysql_close($db);
?>
</table></form>
</body></html>ログイン後にコピー
テーブルの赤い部分は、この配列を動的にしたいのです。そうしないと、すべてのボタンが 1 つのデータに対してのみ動作します。何か良い方法はありますか？
1. 保存ボタンをクリックしたときにトリガーする onclick メソッドを指定します
2. ajax を使用してパラメーターをバックグラウンドに送信し、php プログラムを呼び出します
3. 次に、受信したコンテンツをデータベースに送信します
4. 次の場合はページに戻ります成功または失敗
申し訳ありませんが、24 行目です。今は色が付いていませんでした。
これを実行すると、非表示に設定されます
.show() が 1 つ
.hide() が 1 つ
操作がクリックされると、関数がトリガーされて別のボタンに変換されます
lz を選択することをお勧めしますjq セレクターは非常に強力です
ajax と組み合わせると、大量の入力送信作業を完了するのに十分です
ここでデータを送信するには、ajax を使用する必要があります
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type"
content="text/html; charset=UTF-8"><title>Insert title here</title><script language="javascript" type="text/javascript">
function showtd(num) {
document.getElementById("bg"+num).style.display = "none";
document.getElementById("show"+num).style.display = "block";
}
function hidetd(num) {
document.getElementById("bg"+num).style.display = 'block';
document.getElementById("show"+num).style.display = 'none';
}
function change()
{
var tds = document.getElementsByTagName("td");
var t1 = document.getElementById("a").innerHTML;
var txt = document.createElement("input");
txt.type = "text";
txt.value = t1;
txt.id = "sort_t";
tds[29].appendChild(txt);
txt.select();
}
function mouseup(){
if (document.getElementById("sort_t") && event.srcElement.id != "sort_t")
{
var obj = document.getElementById("sort_t").parentElement;
var txtValue = document.getElementById("sort_t").value;
obj.innerText = txtValue;
}
}
</script></head><body><form><table border="1">
<?php
$db = mysql_connect('localhost','root','root');
mysql_select_db('ec',$db);
if (!$db)
{
die('Could not connect: ' . mysql_error());
}
$result = mysql_query("select * from goods");
echo "<tr><th>GoodsID</th>
<th>BarCode</th><th>GoodsName</th><th>Category</th><th>Specifications</th><th>Manufacturers</th>
<th>Numbers</th><th>Instructions</th><th>Pictures</th><th>Update</th><th>Delete</th></tr>";
$n = 0;
while($row = mysql_fetch_array($result))
{
echo "<tr>";
echo "<td>" . $row['id'] . "</td>";
echo "<td id='a'>" . $row['barcode'] . "</td>";
echo "<td>" . $row['goods_name'] . "</td>";
echo "<td>" . $row['category'] . "</td>";
echo "<td>" . $row['specifications'] . "</td>";
echo "<td>" . $row['manufacturers'] . "</td>";
echo "<td>" . $row['number'] . "</td>";
echo "<td>" . $row['instruction'] . "</td>";
echo "<td>" . "<img src = '$row[picture_url]' style='width:80px;height=60px'/>" . "</td>";
echo "<td id='bg$n'>".
"<input id='btnshow$n' type='button' value='Update' onclick='showtd($n);change()' />".
"</td>".
"<td id='show$n' style='display:none'>".
"<input id='btnclose$n' type='button' value='Save' onclick='hidetd($n);mouseup()'/>".
"</td>";
echo "<td>"."<a href='delete.php?id=$row[id]'>"."Delete"."</a>"."</td>";
echo "</tr>";
++$n;
}
mysql_close($db);
?>
</table></form></body></html>ログイン後にコピー
24 行目の配列を動的に変更できますか? それ以外の場合は、すべてのボタンは同じデータのみを操作します。どう変更すればよいでしょうか?
rreee
今の説明はあまり明確ではありません。「 src= "/jquery/jquery.js">
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
