如何在提交后用其他内容替换div内容

Question

我想知道如何在onchange函数之后用新数据替换数据div。

看到一些答案我决定改变我的帖子，以便更清楚我想做什么。

我有一个div，它有来自数据库的数据。 在该div内部还有一个选择，因此用户可以更改行

现在我想要的是，如果用户选择一种颜色，它将调用ajax.php来对数据库进行更改，然后它必须返回新值。

所以

<div>
<table>
<tr>
    <td><select><option value="1">red</option><option value="2">Blue</option></select><td>
    <td>Rest of the data from the database</td>
</tr>
</table>
</div>

现在用户更改了颜色 结果现在应该是

<div>
<table>
<tr bgcolor="red"> <-- this is new data
    <td><select><option value="1">red</option><option value="2">Blue</option></select><td>
    <td>Rest of the data from the database</td>
</tr>
</table>
</div>

参见示例

正如您所看到的，第一行是用户可以更改颜色的位置。

Answer 1

我认为，因为我理解你的问题，你的代码应该如下所示。

    <script>

    function chk(obj)
    {
        var name=$(obj).val();
        var dataString='name='+ name;
        $.ajax({
            type: "POST",
            url: "ajax.php",
            data: dataString,
            success: function( returnedData ) {
                $( '#container' ).html( returnedData );
            }
        });
        return false;
    }

</script>


<div class="data" >

    here is some data that comes from mysql database.

    <form method="post" action="" id="formSearch">  

        <select name="color" class="test" id="name" onchange="chk(this);">
            <option value="0"></option>
            <option value="1" style="background-color: #ff0000"></option>
            <option value="2" style="background-color: #3000ff"></option>
            <option value="3" style="background-color: #36ff00"></option>
            <option value="4" style="background-color: #e400ff"></option>
            <option value="5" style="background-color: #fff000"></option>
        </select>

    </form>

    <div id="container">

    </div>

</div>