Jeditable不在IE表上工作,但在FF,Chrome中工作

时间:2011-11-12 19:29:44

标签: jquery jeditable

<html>

    <head>

        <script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
        <script type="text/javascript" src="js/jquery.jeditable.min.js"></script>
        <script type="text/javascript" src="js/jquery.jeditable.checkbox.js"></script>

        <script>

            $(function () {
                $(".editable").click(function (event) {
                    $(this).editable('ajax_save.php',{
                        submit      : 'Save',
                        cancel      : 'Cancel',
                        tooltip     : ''
                    });
                });
            });

        </script>

    </head>

    <body>

        <table>

            <tr>

                <td class='editable' id='id-1234'>value of 1234</td>
                <td class='editable' id='id-1235'>value of 1235</td>                

            </tr>

            <tr>

                <td class='editable' id='id-1236'>value of 1236</td>
                <td class='editable' id='id-1237'>value of 1237</td>                

            </tr>

        </table>

    </body>

</html>

下面的代码在FF / Chrome中运行正常,但在IE中失败,当我点击td元素时,它消失...在开发控制台上它显示某条线路上的错误但该错误未显示在FF中/铬。

有什么想法吗?

2 个答案:

答案 0 :(得分:1)

我认为问题是由jQuery将display属性设置为table-cell引起的。 IE 7和8不支持,所以他们会做出奇怪的行为并抛出错误。

我建议的解决方法是在每个单元格中放置一个<div>并将可编辑的内容应用于该单元而不是单元格。

答案 1 :(得分:0)

似乎并非所有选项都适用于IE 7/8 ......

此代码有效

$(document).ready(function() {
    $(".editable").editable("ajax.php",{
        type: "text"
    });
});

这至少在IE8上没有......

$(document).ready(function() {
    $(".editable").editable("ajax.php",{
        type: "text", submit:"OK",cancel:"Cancel"
    });
});

也许这是一个可裁剪处理元素的错误