Question

我的问题是关于组合HTML5功能ContentEditable和localStorage的代码。

这是我的两个JS函数，一个用于在表格单元格中存储用户编辑，另一个用于获取值并将其传递给表格单元格。

<script type="text/javascript">

function storeUserEdit(id) {
    var pre_value = document.getElementById(id).innerHTML;
    localStorage.setItem("userEdit",pre_value);
    }
function applyUserEdit() {  
    if (localStorage.getItem("userEdit")){
    var new_value = localStorage.getItem("userEdit");
    }
    document.getElementById('prjSch_row1_col1').innerHTML = localStorage.getItem("userEdit");
} 
</script>

这里嵌入了正文内容中的这两个函数：

...

<td id="prjSch_row1_col1" contenteditable="true" onkeyup="storeUserEdit(this.id)" >
</td>
<script>applyUserEdit()</script>

...

我想在我的HTML页面中使用这个表格单元格以及如何用id替换prjSch_row1_col1并将其传递给函数getUserEdit（）;

非常感谢！

Answer 1

您是否尝试执行this之类的操作。因为你在问题中提到的不足以让我思考答案。什么时候需要在页面加载或......上发起applyUserEdit()功能。

请让我了解足够的细节。

16/08/2013＆gt;

非常抱歉延误！请找到我在Firefox中测试的以下代码。这是你想要的行为吗？请不要在小提琴手中进行测试。它没有在那里工作，我不知道为什么。

`

<head>
    <script type="text/javascript">
        function storeUserEdit(id) {
            var pre_value = document.getElementById(id).innerHTML;
            localStorage.setItem("userEdit",pre_value);
            localStorage.setItem('userEditControl', id);
        }
        function applyUserEdit(id) {
            var new_value = '';
            if (localStorage.getItem("userEdit")){
                new_value = localStorage.getItem("userEdit");
            }
            if(localStorage.getItem('userEditControl') === id){
                document.getElementById(id).innerHTML = localStorage.getItem("userEdit");
            }
            //this is just to check whether the code is working
            document.getElementById('log').value = document.getElementById('log').value + '\n' + localStorage.getItem("userEdit");
        }
    </script>
</head>
<body>
    <table border="1">
        <tr>
            <td>User Name:</td>
            <td id="uname" contenteditable="true" onkeyup="storeUserEdit(this.id)" onblur="applyUserEdit(this.id)">value...</td>
        </tr>
        <tr>
            <td>Password:</td>
            <td id="pword" contenteditable="true" onkeyup="storeUserEdit(this.id)" onblur="applyUserEdit(this.id)">value...</td>
        </tr>
    </table>
    <textarea multiline="true" id="log"></textarea>
</body>

`

如果您有任何问题，请告诉我。

传递带有ID的HTML元素

1 个答案: