将脚本函数传递到另一个html脚本页面

如何解决将脚本函数传递到另一个html脚本页面

function Payment() {
  var name = document.getElementByID("name").value;
  alert(name);
}

localStorage.setItem("Payment",Payment());

我该怎么办，有可能吗？

解决方法

存储函数名称，并从其他脚本中读取该名称以调用该函数。其他脚本必须包含该功能。

在两个脚本中都包含它，或者如果在第一个脚本中根本不使用它，则仅包含在第二个脚本中。

const obj = {
  payment: () => {
    var name = document.getElementByID('name').value
    alert(name)
  }
}

第一个脚本（设置要存储的函数名称）

localStorage.setItem('func','payment')

第二个脚本（获取函数名称并调用它）

const funcName = localStorage.getItem('func')

// Call function
obj[funcName]()

注意：如果您不想复制代码，则使用eval（）是解决方案，但我认为这非常危险，因为用户可以在localStorage中修改函数并执行任何代码。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval

您可以将函数作为string存储到localStorage中，并可以使用eval函数重复使用。

要将函数存储到localStorage

function Payment() {
  var name = document.getElementById("name").value;
  console.log(name);
  alert(name);
}
localStorage.setItem('func',Payment.toString());

要从localStorage获取功能日期。

localStorage.getItem('func');

附件显示了如何调用字符串化函数。

var payment = `function Payment() {
  var name = document.getElementById("name").value;
  console.log(name);
  alert(name);
}`;

eval(payment);
Payment();

<input type="text" id="name" value="hello" />

FAIK，localStorage无法存储功能。但是，您可以存储代码并在以后进行评估。

function Payment() {
  var name = document.getElementByID("name").value;
  alert(name);
}

// store Payment or Payment.toString()
// storing Payment() is storing the function's result
localStorage.setItem("Payment",Payment.toString())

然后再...

const StoredPayment = eval('(' + localStorage.getItem("Payment") + ')');

StoredPayment();