mysql - 怎么用jQuery、Ajax、php实现这样的无刷新编辑功能？-PHP-Tutorial-php.cn

Inhaltsverzeichnis

回复内容：

Heim

Backend-Entwicklung

PHP-Tutorial

mysql - 怎么用jQuery、Ajax、php实现这样的无刷新编辑功能？

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Jun 06, 2016 pm 08:50 PM

ajax jquery mysql php

先放我做好的效果图。如下图1为编辑前的效果，图2为点击“修改库存”后的效果。html和CSS已经弄出来了，但不懂javascript。修改后的数据直接通过后台php修改到mysql，若成功则直接返回数据到库存的td单元格。

mysql - 怎么用jQuery、Ajax、php实现这样的无刷新编辑功能？

然后是我的html代码。

<tr id="3308">
    <td><img  src="/static/imghw/default1.png"  data-src="/1369118039-3308.jpg!w120"  class="lazy" / alt="mysql - 怎么用jQuery、Ajax、php实现这样的无刷新编辑功能？" ></td>
    <td><strong>3308</strong></td>
    <td><span>3.97</span> M³</td>
    <td><span>2950.00</span> 元</td>
    <td>2013-05-21 14:36:20</td>
    <td><input type="text" placeholder="输入库存数"></input></td>
    <td><a class="button small success">保存修改</a></td>
</tr>

Nach dem Login kopieren

求兄弟们能给个详细点的答案，实在是不懂javascript啊，整个页面就差这一个功能实现了。另外，这样的表格有长长一列，我可以用php循环生成动态html标签id的。

感谢感谢！

回复内容：

mysql - 怎么用jQuery、Ajax、php实现这样的无刷新编辑功能？

然后是我的html代码。

<tr id="3308">
    <td><img  src="/static/imghw/default1.png"  data-src="/1369118039-3308.jpg!w120"  class="lazy" / alt="mysql - 怎么用jQuery、Ajax、php实现这样的无刷新编辑功能？" ></td>
    <td><strong>3308</strong></td>
    <td><span>3.97</span> M³</td>
    <td><span>2950.00</span> 元</td>
    <td>2013-05-21 14:36:20</td>
    <td><input type="text" placeholder="输入库存数"></input></td>
    <td><a class="button small success">保存修改</a></td>
</tr>

Nach dem Login kopieren

感谢感谢！

上面回答的，我没有采纳答案，实在是我水平有限，没有修改好。在php100也同提了这个问题，很快得到解决。下面贴上php100的答案，并附上链接，方便他人。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="http://upcdn.b0.upaiyun.com/libs/jquery/jquery-1.9.1.min.js"></script>
<style type="text/css">
table{border-collapse:collapse}
td{border:1px #CCC solid;padding:5px;font-size:12px}
a{color:#069;text-decoration:none}
a:hover{color:#C00;text-decoration:underline}
a.button{display:block;border:1px #693 solid;background:#9C6;padding:4px;color:#FFF}
a.success{border-color:#369;background:#69C}
input{font-size:12px;border:1px #999 solid;padding:4px;width:40px;text-align:center}
</style>
</head>
<body>
<table id="dataList">
    <tr>
        <td><strong>3308</strong></td>
        <td><span>3.97</span> M3</td>
        <td><span>2950.00</span> 元</td>
        <td>2013-05-21 14:36:20</td>
        <td>
            <span>库存 0 套</span>
            <input style="display:none;" type="text" value="0" />
        </td>
        <td><a href="#" class="button small" rel="2">修改库存</a></td>
    </tr>
    <tr>
        <td><strong>3308</strong></td>
        <td><span>3.97</span> M3</td>
        <td><span>2950.00</span> 元</td>
        <td>2013-05-21 14:36:20</td>
        <td>
            <span>库存 0 套</span>
            <input style="display:none;" type="text" value="0" />
        </td>
        <td><a href="#" class="button small" rel="1">修改库存</a></td>
    </tr>
</table>
<script type="text/javascript">
$("#dataList a").click(function(){
    var a=$(this),td=a.parent().prev(),s=td.children('span'),i=td.children('input');
    if($.trim(a.text())=='修改库存'){
        a.text('保存修改').addClass('success');
        s.hide();
        i.show();
    }else{
        $.post('save.php',{id:a.attr('rel'),num:i.val()},function(r){
            alert(r.msg);
            if(r.status){
                s.html('库存 '+r.num+' 套');
                a.text('修改库存').removeClass('success');
                s.show();
                i.hide()
            }
        },'JSON')
    }
    return false
})
</script>

</body>
</html>

Nach dem Login kopieren

上面是html页面，下面是php

<?php
header("Content-type: text/html; charset=utf-8");
$r = array(
    'msg' => '错误！',
    'status' => FALSE,
    'num' => 0
);
if(isset($_POST['id']) && isset($_POST['num'])){
    if(is_numeric($_POST['id']) && is_numeric($_POST['num'])){
        $id = (int)$_POST['id'];
        $num = (int)$_POST['num'];
        $r['msg'] = '修改成功！';
        $r['num'] = $num;
        $r['status'] = TRUE;
    }else{
        $r['msg'] = '错误！[2]';
    }
}else{
    $r['msg'] = '错误！[1]';
}

echo json_encode($r);
?>

Nach dem Login kopieren

<code>$(document).ready(function() {
//为每一个具有相同id=cartUpdate 的 添加click事件
$("#cartUpdate").live("click",function(){
    var text=$(this).text();
    if(text=="修改数量"){
        var count = $(this).parent().prev().text();
        $(this).parent().prev().html("<input style='width:35px' min=1 type='number' value="+count +" />");
        $(this).text("确定");
    }else if(text=="确定"){
        var count2 = $(this).parent().prev().children().val();
        var id = $(this).parent().prev().prev().prev().prev().text();
        $.post("/cart/update", {
            "productId" : id,"count":count2
        }, function(data) {
            if(data=="ok"){
                $("#p" + id).next().next().next().text(count2);
                $("#p" + id).nextAll().find("button").text("修改数量");
            }else{
                alert("修改失败");
            }
        });
    }
});
</code>

Nach dem Login kopieren

Erklärung dieser Website

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

Assassin's Creed Shadows: Seashell Riddle -Lösung

3 Wochen vor By DDD

Was ist neu in Windows 11 KB5054979 und wie Sie Update -Probleme beheben

2 Wochen vor By DDD

Wo kann man die Kransteuerungsschlüsselkarten in Atomfall finden

3 Wochen vor By DDD

Ersparnis in R.E.P.O. Erklärt (und speichern Dateien)

1 Monate vor By 尊渡假赌尊渡假赌尊渡假赌

Assassins Creed Shadows - So finden Sie den Schmied und entsperren Sie die Waffen- und Rüstungsanpassung

4 Wochen vor By DDD

Heiße Werkzeuge

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Heiße Themen

Wo ist der Login-Zugang für Gmail-E-Mail?

7569

CakePHP-Tutorial

1386

Wie lautet das Format des Kontonamens von Steam?

Win11 -Aktivierungsschlüssel dauerhaft

NYT -Verbindungen Hinweise und Antworten

107

Related knowledge

MySQL: Eine Einführung in die beliebteste Datenbank der Welt Apr 12, 2025 am 12:18 AM

MySQL ist ein Open Source Relational Database Management -System, das hauptsächlich zum schnellen und zuverlässigen Speicher und Abrufen von Daten verwendet wird. Sein Arbeitsprinzip umfasst Kundenanfragen, Abfragebedingungen, Ausführung von Abfragen und Rückgabergebnissen. Beispiele für die Nutzung sind das Erstellen von Tabellen, das Einsetzen und Abfragen von Daten sowie erweiterte Funktionen wie Join -Operationen. Häufige Fehler umfassen SQL -Syntax, Datentypen und Berechtigungen sowie Optimierungsvorschläge umfassen die Verwendung von Indizes, optimierte Abfragen und die Partitionierung von Tabellen.

PHP und Python: Vergleich von zwei beliebten Programmiersprachen Apr 14, 2025 am 12:13 AM

PHP und Python haben jeweils ihre eigenen Vorteile und wählen nach den Projektanforderungen. 1.PHP ist für die Webentwicklung geeignet, insbesondere für die schnelle Entwicklung und Wartung von Websites. 2. Python eignet sich für Datenwissenschaft, maschinelles Lernen und künstliche Intelligenz mit prägnanter Syntax und für Anfänger.

Der aktuelle Status von PHP: Ein Blick auf Webentwicklungstrends Apr 13, 2025 am 12:20 AM

PHP bleibt in der modernen Webentwicklung wichtig, insbesondere in Content-Management- und E-Commerce-Plattformen. 1) PHP hat ein reichhaltiges Ökosystem und eine starke Rahmenunterstützung wie Laravel und Symfony. 2) Die Leistungsoptimierung kann durch OPCACHE und NGINX erreicht werden. 3) Php8.0 führt den JIT -Compiler ein, um die Leistung zu verbessern. 4) Cloud-native Anwendungen werden über Docker und Kubernetes bereitgestellt, um die Flexibilität und Skalierbarkeit zu verbessern.

Warum MySQL verwenden? Vorteile und Vorteile Apr 12, 2025 am 12:17 AM

MySQL wird für seine Leistung, Zuverlässigkeit, Benutzerfreundlichkeit und Unterstützung der Gemeinschaft ausgewählt. 1.MYSQL bietet effiziente Datenspeicher- und Abruffunktionen, die mehrere Datentypen und erweiterte Abfragevorgänge unterstützen. 2. Übernehmen Sie die Architektur der Client-Server und mehrere Speichermotoren, um die Transaktion und die Abfrageoptimierung zu unterstützen. 3. Einfach zu bedienend unterstützt eine Vielzahl von Betriebssystemen und Programmiersprachen. V.

PHP: Die Grundlage vieler Websites Apr 13, 2025 am 12:07 AM

Die Gründe, warum PHP für viele Websites der bevorzugte Technologie -Stack ist, umfassen die Benutzerfreundlichkeit, die starke Unterstützung der Community und die weit verbreitete Verwendung. 1) Einfach zu erlernen und zu bedienen, geeignet für Anfänger. 2) eine riesige Entwicklergemeinschaft und eine reichhaltige Ressourcen haben. 3) in WordPress, Drupal und anderen Plattformen häufig verwendet. 4) Integrieren Sie eng in Webserver, um die Entwicklung der Entwicklung zu vereinfachen.

PHP: Eine Schlüsselsprache für die Webentwicklung Apr 13, 2025 am 12:08 AM

PHP ist eine Skriptsprache, die auf der Serverseite weit verbreitet ist und insbesondere für die Webentwicklung geeignet ist. 1.PHP kann HTML einbetten, HTTP -Anforderungen und Antworten verarbeiten und eine Vielzahl von Datenbanken unterstützt. 2.PHP wird verwendet, um dynamische Webinhalte, Prozessformdaten, Zugriffsdatenbanken usw. mit starker Community -Unterstützung und Open -Source -Ressourcen zu generieren. 3. PHP ist eine interpretierte Sprache, und der Ausführungsprozess umfasst lexikalische Analyse, grammatikalische Analyse, Zusammenstellung und Ausführung. 4.PHP kann mit MySQL für erweiterte Anwendungen wie Benutzerregistrierungssysteme kombiniert werden. 5. Beim Debuggen von PHP können Sie Funktionen wie error_reporting () und var_dump () verwenden. 6. Optimieren Sie den PHP-Code, um Caching-Mechanismen zu verwenden, Datenbankabfragen zu optimieren und integrierte Funktionen zu verwenden. 7

Mysqls Platz: Datenbanken und Programmierung Apr 13, 2025 am 12:18 AM

Die Position von MySQL in Datenbanken und Programmierung ist sehr wichtig. Es handelt sich um ein Open -Source -Verwaltungssystem für relationale Datenbankverwaltung, das in verschiedenen Anwendungsszenarien häufig verwendet wird. 1) MySQL bietet effiziente Datenspeicher-, Organisations- und Abruffunktionen und unterstützt Systeme für Web-, Mobil- und Unternehmensebene. 2) Es verwendet eine Client-Server-Architektur, unterstützt mehrere Speichermotoren und Indexoptimierung. 3) Zu den grundlegenden Verwendungen gehören das Erstellen von Tabellen und das Einfügen von Daten, und erweiterte Verwendungen beinhalten Multi-Table-Verknüpfungen und komplexe Abfragen. 4) Häufig gestellte Fragen wie SQL -Syntaxfehler und Leistungsprobleme können durch den Befehl erklären und langsam abfragen. 5) Die Leistungsoptimierungsmethoden umfassen die rationale Verwendung von Indizes, eine optimierte Abfrage und die Verwendung von Caches. Zu den Best Practices gehört die Verwendung von Transaktionen und vorbereiteten Staten

Die dauerhafte Relevanz von PHP: Ist es noch am Leben? Apr 14, 2025 am 12:12 AM

PHP ist immer noch dynamisch und nimmt immer noch eine wichtige Position im Bereich der modernen Programmierung ein. 1) Einfachheit und leistungsstarke Unterstützung von PHP machen es in der Webentwicklung weit verbreitet. 2) Seine Flexibilität und Stabilität machen es ausstehend bei der Behandlung von Webformularen, Datenbankoperationen und Dateiverarbeitung; 3) PHP entwickelt sich ständig weiter und optimiert, geeignet für Anfänger und erfahrene Entwickler.

See all articles