0

我有一个编辑过程的功能。当用户编辑值并单击按钮时，它将保存到数据库中。但是目前，当我单击按钮时，出现错误

ReferenceError：未定义更改

下面是我的代码。谁能告诉我哪里出错并帮助我解决它？

JavaScript

$(document).ready(function () {
    $('td.edit').click(function (e) {
        var $target = $(e.target);
        if ($target.is('#editbox')) {
            return;
        }
        $('.ajax').html($('.ajax input').val());
        $('.ajax').removeClass('ajax');
        $(this).addClass('ajax');
        $(this).html('<input id="editbox"  size="5" type="text" value="' + $(this).text() + '">');
        $('#editbox').select();
    });

    $('td.edit').ready(function () {
        function change() {
            arr = $(this).attr('class').split(" ");
            if (event.which == 13) {

                $.ajax({
                    type: "POST",
                    url: "clientnetworkpricelist/update.php",
                    data: "value=" + $('.ajax input').val() + "&rowid=" + arr[2] + "&field=" + arr[1],
                    success: function (data) {
                        $('.ajax').html($('.ajax input').val());
                        $('.ajax').removeClass('ajax');
                    }
                });
            }

        }

    });
    $('#editbox').live('blur', function () {

        $('.ajax').html($('.ajax input').val());
        $('.ajax').removeClass('ajax');
    });
});

html

<td><img onclick="change()"  src="/image/Picture1.png" style="margin:0 0 0 6px;;cursor:pointer" ></td>
4

2 回答 2

1

首先你有：$('td.edit').ready(function ()你的 html 在哪里<td><img...。没有edit课。其次，也许你应该试试这个：

HTML：

<td class="edit"><img src="/image/Picture1.png" style="margin:0 0 0 6px;;cursor:pointer"></td>

JavaScript：

$(document).ready(function() {
    $('td.edit').on('click', function() {
        //your magic from change() function
    });
});

jQuery 1.7也live()弃用了函数。你应该on()改用。

编辑：

如果您想采取行动，onClick那么为什么要抓住enter媒体？记得添加到你的<td>where 按钮是一个edit类。

改变这个：

$('td.edit').ready(function () {
    function change() {
        arr = $(this).attr('class').split(" ");
        if (event.which == 13) {

            $.ajax({
                type: "POST",
                url: "clientnetworkpricelist/update.php",
                data: "value=" + $('.ajax input').val() + "&rowid=" + arr[2] + "&field=" + arr[1],
                success: function (data) {
                    $('.ajax').html($('.ajax input').val());
                    $('.ajax').removeClass('ajax');
                }
            });
        }

    }

});

对此：

$('td.edit img').on('click', function() {
    arr = $(this).attr('class').split(" "); //it will be clicked <img>
    $.ajax({
        type: "POST",
        url: "clientnetworkpricelist/update.php",
        data: "value=" + $('.ajax input').val() + "&rowid=" + arr[2] + "&field=" + arr[1],
        success: function (data) {
            $('.ajax').html($('.ajax input').val());
            $('.ajax').removeClass('ajax');
        }
    });
});

编辑：

我个人会做这样的事情：

HTML：

<td class="edit"><a href="#" data-id="1" data-field="somefield"><img src="exp.jpg" /></a></td>

JavaScript：

$('td.edit a').on('click', function(e) {
    e.preventDefault();
    $.ajax({
        type: "POST",
        url: "clientnetworkpricelist/update.php",
        data: "value=" + $('.ajax input').val() + "&rowid=" + $(this).attr('data-id') + "&field=" + $(this).attr('data-field'),
        success: function (data) {
            $('.ajax').html($('.ajax input').val());
            $('.ajax').removeClass('ajax');
        }
    });
});
于 2013-11-07T06:49:06.743 回答
0

而不是做

$('td.edit').ready(function () {

     //change function definition

});

您可以将函数绑定到它自己的点击事件

$('td.edit').click(function () {
        arr = $(this).attr('class').split(" ");
        if (event.which == 13) {

            $.ajax({
                type: "POST",
                url: "clientnetworkpricelist/update.php",
                data: "value=" + $('.ajax input').val() + "&rowid=" + arr[2] + "&field=" + arr[1],
                success: function (data) {
                    $('.ajax').html($('.ajax input').val());
                    $('.ajax').removeClass('ajax');
                }
            });
        }

});

onclick="change()"并从 html中删除代码

于 2013-11-07T06:49:45.907 回答