Question

我想从第二页中获取点击事件。 第一页有一个第二页的链接，当点击添加 HTML行的按钮时，有一个按钮在第一页。我正在尝试使用localStorage来传递数据。我的代码不起作用，请看下面的内容：

1st Page.html

的 HTML

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

JS

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

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

2nd Page.html

HTML

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

JS

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);
}
};

Answer 1

您还没有正确定义addRow()功能。函数的名称是使用关键字function定义的，而不是在函数体内部。你的代码：

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

div.className = 'row';

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

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;

Answer 2

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

在将事件附加到它之前定义dataInput
object.onclick应该是dataInput.onclick，因为这是被点击的元素。（点击事件你真正想要的吗？也许onkeyup？）
当你设置localStorage时，你想要设置传递给第1页的函数定义，它似乎是addRow（）。只需删除括号以仅传递定义。（也应在使用前定义）
如果你想通过这个功能，你不应该在第2页上设置onclick事件。你应该做的是记录你去第1页时想要它运行的次数。
如果不改变，你不需要每次都通过这个功能;只需设置一次并记录它被点击的次数。
第1页可以捕获load事件并检查localStorage以获取函数定义及其运行次数。然后它可以循环并执行该功能。
您所拥有的代码并没有将链接添加回第2页（如果您正在查找的内容），但是当您知道文件名和路径时，可以将其添加到addrow函数中。

Page 1

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

addEvent(window, 'load', function (event) {
  if (localStorage.getItem('StorageName') && localStorage.getItem('rowsToAdd')) {
    for(var i = 0; i > rowsToAdd;i++){
      var addNewRow = localStorage.getItem('StorageName');
      addNewRow();
     }
  }
});

Page 2

var dataInput = document.getElementById('data');

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

    div.className = 'row';

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

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

};
localStorage.setItem('StorageName', addRow);
dataInput.onclick = function() {
    if(localStorage.getItem('rowsToAdd')){
        localStorage.setItem('rowsToAdd', localStorage.getItem('rowsToAdd') + 1); 
    }else{
        localStorage.setItem('rowsToAdd',1);
    }
}

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

我也对你想要的东西有了最好的理解，但我没有完全看到你想要做的事情的结果。

通过localStorage在两个页面之间传递click事件

2 个答案:

Page 1

Page 2