Javascript 通过localStorage在两个页面之间传递单击事件

我想从第二页中获取一个点击事件第一页有一个链接指向第二页，单击按钮时有一个按钮，在第一页上添加HTML行。我试图使用

localStorage

传递数据。我的代码不起作用，请看下面：

第1页.html

HTML

<div id="content">
</div>

<input id="data" type="button" value="+" onclick="addRow()">

第二页.html

HTML

<div id="content">
</div>

<input id="data" type="button" value="+" onclick="addRow()">

JS

var     output = document.getElementById('content');

addEvent(window, 'storage', function (event) {
  if (event.key == 'StorageName') {
    output.innerHTML = event.newValue;
  }
});

addEvent(dataInput, 'keyup', function () {
localStorage.setItem('StorageName', this.value);
});

var dataInput = dataInput = document.getElementById('data');
object.onclick = function(){
addRow() {
var div = document.createElement('div');

div.className = 'row';

div.innerHTML = '<button>GO</button>';

document.getElementById('content').appendChild(div);
}
};

addEvent（数据输入，'keyup'，函数（）{
localStorage.setItem（'StorageName'，this.value）；
});
var dataInput=dataInput=document.getElementById（'data'）；
object.onclick=function（）{
addRow（）{
var div=document.createElement（'div'）；
div.className='行'；
div.innerHTML='GO'；
document.getElementById（'content'）.appendChild（div）；
}
};

您没有正确定义

addRow（）

函数。函数名是用关键字

function

定义的，而不是在函数体内部。您的代码：

object.onclick = function(){
addRow() {
var div = document.createElement('div');

div.className = 'row';

div.innerHTML = '<button>GO</button>';

document.getElementById('content').appendChild(div);
}
};

object.onclick=function（）{
addRow（）{
var div=document.createElement（'div'）；
div.className='行'；
div.innerHTML='GO'；
document.getElementById（'content'）.appendChild（div）；
}
};

应改为：

function addRow() {
    var div = document.createElement('div');

    div.className = 'row';

    div.innerHTML = '<button>GO</button>';

    document.getElementById('content').appendChild(div);
}
object.onclick = addRow;

函数addRow（）{
var div=document.createElement（'div'）；
div.className='行'；
div.innerHTML='GO'；
document.getElementById（'content'）.appendChild（div）；
}
object.onclick=addRow；

我同意skyline3000的回答，应该定义addRow（）。此外，还有一些其他可能/应该改变的事情：

• 在将事件附加到dataInput之前定义dataInput
• object.onclick应该是dataInput.onclick，因为它是被单击的元素。（点击事件是你真正想要的吗？也许是onkeyup？）
• 设置localStorage时，需要设置传递到第1页的函数定义，该函数定义看起来是addRow（）。只需删除括号即可传递定义。（也应在使用前定义）
• 如果只想传递函数，则不应在第2页上设置onclick事件。您可能应该做的是记录当您转到第1页时希望它运行的次数
• 如果函数没有改变，你不需要每次都传递它；只需设置一次，并记录单击的次数
• 第1页可以捕获load事件，并检查localStorage中的函数定义及其运行次数。然后它可以循环并执行该功能
• 如果您正在查找第2页的链接，那么您的代码不会添加回第2页的链接，但是您可以在知道文件名和路径后将其添加到addrow函数中

第1页 第2页

var-dataInput=document.getElementById（'data'）；
函数addRow（）{
var div=document.createElement（'div'）；
div.className='行'；
div.innerHTML='GO'；
document.getElementById（'content'）.appendChild（div）；
};
setItem（'StorageName'，addRow）；
dataInput.onclick=函数（）{
if（localStorage.getItem（'rowsToAdd'））{
localStorage.setItem（'rowsToAdd'，localStorage.getItem（'rowsToAdd'）+1）；
}否则{
setItem（'rowsToAdd'，1）；
}
}

我没有测试这段代码，所以它可能无法复制+粘贴，但希望非常接近

---

我在回答这个问题时也充分理解了你想要我能处理的东西，但我没有完全看到你所做的事情的预期结果。

@pixelearth你删除了你的答案，并对我的答案进行了评论，但我相信你是想对实际问题进行评论……的确，很好，你的JS很难理解。对于初学者，我看不到任何地方定义了addRow函数。当您单击按钮时，实际会发生什么？您是否遵循了步骤调试器中的代码？可能还需要进行一些空检查。在触发document ready事件之前，可能不执行任何操作。