Question

我在javascript中创建了这段代码，这段代码工作正常，代码使用下拉列表来选择项目。

<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
</head>
<body><br><div id="id6"></div>
    Select an item from the following list:<br />
  <select id="select" onchange="myFuntam()">
   <option value="">choose
  <option value="var_1">car1
  <option value="var_2">car2
  <option value="var_3">car3
  <option value="var_4">car4
</select>
        <script>
   function myFuntam() {
    var x = document.getElementById("select").value;
        url="http//domain1.com";
        ur2="http//domain2.com";
        ur3="http//domain3.com";
        ur4="http//domain4.com";
    var    link_1;
      if (x == "var_1") {
        link_1=url;

   }
       if (x == "var_2") {
        link_1=ur2;

   }
   if (x == "var_3") {
        link_1=ur3;

   }
   if (x == "var_4") {
        link_1=ur4;

   }
    document.getElementById("id6").innerHTML = "You selected: " + link_1;
}




    </script>
    </body>
</html>

现在我需要调用函数中的变量link_1，允许我将此变量与另一个函数或函数的任何位置一起使用。我尝试使用此代码

<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
</head>
<body><br><div id="id6"></div>
    Select an item from the following list:<br />
  <select id="select" onchange="myFuntam()">
   <option value="">choose
  <option value="var_1">car1
  <option value="var_2">car2
  <option value="var_3">car3
  <option value="var_4">car4
</select>
        <script>
   function myFuntam() {
    var x = document.getElementById("select").value;
        url="http//domain1.com";
        ur2="http//domain2.com";
        ur3="http//domain3.com";
        ur4="http//domain4.com";
    var    link_1;
      if (x == "var_1") {
        link_1=url;

   }
       if (x == "var_2") {
        link_1=ur2;

   }
   if (x == "var_3") {
        link_1=ur3;

   }
   if (x == "var_4") {
        link_1=ur4;

   }
    return link_1;
}
     document.getElementById("id6").innerHTML = "You selected: " + link_1;   



    </script>
    </body>
</html>

但是这段代码不正确，link_1未定义，所以我如何使用link_1的功能。

Answer 1

完成任务的基础知识：

var link_1 = 'foobar';
function ....() { something with link_1; }
console.log(link_1);

Answer 2

您必须在函数外部声明var，以便函数更改其声明的值，并且您可以在函数完成后以您希望的方式继续使用它。

＆＃13;

var link_1;

function myFunction() {
  link_1 = 'www.anysite.com';
}

myFunction();
//now the var can be used outside
console.log(link_1);

//Anothe option could be

var link;

function myFunction2() {
  link = 'www.otherwebsite.com';
  return link;
}

link_2 = myFunction2();
console.log(link_2);

＆＃13;

如果其他选项不起作用，第三个选项可能是使用localStorage。 localStorage.setItem（＆＃39; link_1＆＃39;，link_1_value）; var aLink = localStorage.getItem（＆＃39; link_1＆＃39;）;

选择适合您需求的那个。

Answer 3

使用变量的另一种方法是将信息存储在DOM中。您将通过将这些URL字符串存储在每个option节点中来保存一些代码逻辑，作为HTML5数据属性。

随后可以轻松获得所选的网址。

var sel = document.getElementById('select');

function myFuntam() {
    console.log(sel.options[sel.selectedIndex].dataset.url);
    return sel.options[sel.selectedIndex].dataset.url;
}

Select an item from the following list:<br>
<select id="select" onchange="myFuntam()">
    <option value="">choose
    <option value="var_1" data-url="http//domain1.com">car1</option>
    <option value="var_2" data-url="http//domain2.com">car2</option>
    <option value="var_3" data-url="http//domain3.com">car3</option>
    <option value="var_4" data-url="http//domain4.com">car4</option>
</select>

您当然可以决定将该URL存储在全局变量中，但正如您所看到的，您不再需要大量逻辑来动态检索它。调用该函数只会为您提供所需的URL而不会有太多麻烦。

Answer 4

<html>
<head>
    <meta charset="utf-8">
    <title></title>
</head>

<body>
<div id="id6"></div>
Select an item from the following list:<br />
<select id="select" onchange="myFuntam()">
<option value="">choose
<option value="var_1">car1
<option value="var_2">car2
<option value="var_3">car3
<option value="var_4">car4
</select>
<script>
function myFuntam() {
var x = document.getElementById("select").value;
    url="http//domain1.com";
    ur2="http//domain2.com";
    ur3="http//domain3.com";
    ur4="http//domain4.com";
   var    link_1;
  if (x == "var_1") {
    link_1=url;
}
   if (x == "var_2") {
    link_1=ur2;
 }
 if (x == "var_3") {
    link_1=ur3;
 }
if (x == "var_4") {
    link_1=ur4;
 }
 return link_1;
}
function secondfunction(){
  var linkvalue=myFuntam();
  alert(linkvalue);
}
 document.getElementById("id6").innerHTML = "You selected: " + myFuntam();   
</script>
</body>
</html>

如何在javascript中调用变量输出函数

4 个答案: