未传递功能参数。如何正确地将参数传递给另一个JavaScript文件的功能？

debugcn 发表于 Dev

是的

我想从另一个JavaScript文件调用file2Function(getValue)文件的功能，以在浏览器中打开新页面，并使用通过传递的参数在其上显示一些数据。因此应取值并显示在上。但它显示的“未定义” 。请帮助我找出我在哪里做错。谢谢。(page2.js)(page1.js)myFunction1(e) into file2Function as file2Function(itemFromItems)file2Function(getValue)var itemFromItemspage2.htmlgetValue

// page1.js

function file1Function()
{
		var secPage1 = document.getElementById("page1Section");
		var heading = document.createElement("h4");
		var anchor= document.createElement('a');

		anchor.setAttribute('href',"#");
		anchor.innerText = "Click Me";
		anchor.addEventListener("click", myFunction1);
		heading.appendChild(anchor);
		secPage1.appendChild(heading);
		anchor.id=1;

		function myFunction1(e) {
			var itemFromItems = e.currentTarget.getAttribute("id");
			console.log("item",itemFromItems);
			file2Function(itemFromItems);
			
		}
}


// page2.js
var globalVar;
function file2Function(getValue)
{
	console.log("getValue",getValue);

	window.open("page2.html");
    // window.open("https://www.google.com/");
    
    globalVar=getValue;
	console.log("globalVarNow",globalVar);
}

function loadDynamicData()
{

    var para=document.getElementById("paraId");
    console.log(para);
    para.innerText=globalVar+" : value from myFunction1 (Click Event)";


    var secPage2 = document.getElementById("page2Section");
		var headingJS2 = document.createElement("h4");
		headingJS2.innerText=" This is dynamic heading";
		secPage2.appendChild(headingJS2);
    console.log(para);
}

<!-- page1.html -->
<!DOCTYPE html>
<html>
<head>
	<script src="js/page1.js"></script>
	<script src="js/page2.js"></script>
</head>
<body onload="file1Function()">
	<h3>This is page1</h3>

<section id="page1Section">
	
</section>


<script>
</script>

</body>
</html>


<!-- page2.html -->

<!DOCTYPE html>
<html>
<head>
	
</head>
<body onload="loadDynamicData()">

<h3>This is page2</h3>

<section id="page2Section">
	
</section>
<p id="paraId"></p>

<script src="js/page2.js"></script>

</body>
</html>

伯格·杜登

问题是这globalVar是一个全局变量，但是您要为其分配的值file2Function()只能在其范围内访问，这就是为什么要获取undefined，因为loadDynamicData()无法访问的新值globalVar。

您可以loadDynamicData()从调用file2Function()并getValue作为参数传递，但是由于您需要page2在执行之前打开loadDynamicData()它，因此无法使用。

我建议您将getValue您URL的查询参数作为参数传递，并从内部获取它loadDynamicData()，它将正常工作。

SOLUTION:

function file2Function(getValue)
{
    window.open("page2.html?value="+getValue);
  // window.open("https://www.google.com/");
}

function loadDynamicData()
{
    var url_string = window.location.href
    var url = new URL(url_string);
    var globalVar = url.searchParams.get("value");


    var para=document.getElementById("paraId");
    console.log(para);
    para.innerText=globalVar+" : value from myFunction1 (Click Event)";


    var secPage2 = document.getElementById("page2Section");
        var headingJS2 = document.createElement("h4");
        headingJS2.innerText=" This is dynamic heading";
        secPage2.appendChild(headingJS2);
    console.log(para);

}

如果要隐藏值，可以sessionStorage代替查询参数使用：

function file2Function(getValue)
{
  sessionStorage.setItem('value', getValue)
  window.open("page2.html");
  // window.open("https://www.google.com/");
}

function loadDynamicData()
{
    var globalVar = sessionStorage.getItem('value')

    var para=document.getElementById("paraId");
    console.log(para);
    para.innerText=globalVar+" : value from myFunction1 (Click Event)";


    var secPage2 = document.getElementById("page2Section");
        var headingJS2 = document.createElement("h4");
        headingJS2.innerText=" This is dynamic heading";
        secPage2.appendChild(headingJS2);
    console.log(para);

}

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。

编辑于2021-04-2

我来说两句

0条评论

登录后参与评论

来自分类Dev

Related 相关文章

文章

未传递功能参数。如何正确地将参数传递给另一个JavaScript文件的功能？

未传递功能参数。如何正确地将参数传递给另一个JavaScript文件的功能？

我如何使用此代码将另一个参数传递给php文件

如何将参数数组传递给JavaScript中的另一个函数？

如何正确地将参数传递给函数？[批]

如何正确地将道具状态从一个组件传递到另一个组件？

如何将参数传递给作为另一个函数参数的函数

将选定数量的参数包传递/转发给另一个功能

将选定数量的参数包传递/转发给另一个功能

如何将更新的页面内容传递给另一个功能？

将参数传递给另一个带有空格的Bash文件

将参数传递给另一个文件JS中的函数

如何正确地从设计器的一个功能设置另一个功能的属性？

如何正确地将动态输入字段传递到另一个页面进行显示？

如何将＆rest参数传递给emacs lisp中的另一个函数？

如何将switch参数传递给另一个PowerShell脚本？

如何将输出作为参数传递给另一个命令？

Perl：如何将ARGV参数传递给另一个脚本？

Python：如何将ARGV参数传递给另一个脚本？

如何将命令输出作为多个参数传递给另一个命令

如何将tanh函数作为参数传递给另一个函数？

如何将终端命令作为参数传递给另一个命令

如何将参数4..99传递给另一个函数

如何将参数传递给另一个脚本生成的脚本

如何将引用的参数传递给另一个程序

如何将函数作为参数传递给另一个函数？

如何将泛型函数作为参数传递给另一个函数？

如何将函数的所有参数传递给另一个命令？

如何将命名参数传递给另一个函数需要的函数？

如何使用 rebol/red bind 将块参数传递给另一个函数？

如何将模型的genericgenerator中的参数传递给另一个类（IdGenerator）