-2

场景是:用户从下拉列表中选择一个条目。参考相关条目,我将为现有的 webpath 创建一个新前缀。但我遇到的问题,不会解释为链接部分,所以不会生成链接!用例:如果用户从下拉列表中选择链接1,结果应该是:https://link1//web/sso/bw/ostrfer.jsp(作为链接和文本显示)

你能帮我怎么做到这一点吗?

非常感谢您的帮助!:)

JS:

function output (choice) {


 var index =  choice.selectedIndex;
 var prefix = "";



  if(index == 1) 
prefix = "https://link1";

   else if (index == 2) 
prefix = "https://link2;    

  else if (index == 3) 
prefix = "https://link3";   

  else if (index == 4) 
prefix = "https://link4";   

  else if (index == 5) 
prefix = ""https://link5";



document.getElementById("url").innerHTML = praefix;

}

HTML:

 <body>

   <form>
    <p>
 <select id = "list" name = "list" onchange ='output(this.form.liste);' >

<option></option>
<option>link1</option>
<option>link2</option>
<option>link3</option>
<option>link4</option>
<option>link5</option>



</select>


</p>

</form>




<a href=<span id = "url"></span>/web/sso/bw/ostrfer.jsp> <span id = "url"></span>    /web/sso/bw/ostrfer.jsp</a>

</body>
4

4 回答 4

0

您可以存储此代码段:

/web/sso/bw/ostrfer.jsp

作为一个常数,像这样:

var uri = "/web/sso/bw/ostrfer.jsp";

然后,当用户选择链接时,您可以像这样附加它:

var elem = document.getElementById("url");
elem.setAttribute('href', prefix + uri);

这应该使用新的 url 更新锚标记的“href”属性。

我设置了一个测试示例,以便您可以在此Fiddle中看到它的实际效果。如果您使用浏览器开发人员工具检查链接,您可以看到在执行代码后 href(最初为空字符串“”)已更新为“https://link1/web/sso/bw/ostrfer.jsp ”。

希望这可以帮助。

于 2012-11-28T19:17:51.203 回答
0

您有多个导致问题的语法错误:

第一的

prefix = "https://link2;
                       ^ missing close quote here

第二

prefix = ""https://link5";
          ^ remove the extra quote here

第三

document.getElementById("url").innerHTML = praefix;
                                           ^ should be prefix

第四

<select id = "list" name = "list" onchange ='output(this.form.liste);' >
                                                              ^ should be list or just 'this'

即使存在语法错误,您的代码仍然不正确 -<span>href.<a>

试试这个 jsFiddle Demo - 我改变了代码的工作方式,它不使用跨度。

完整的固定代码:

<script>
function output () {

 var index =  this.selectedIndex;
 var prefix = "";
 var suffix = "/web/sso/bw/ostrfer.jsp";

 prefix = "https://" + this.value;

var link = document.getElementById("url");

link.href = prefix + suffix;
link.innerHTML = prefix + suffix;

}

window.onload = function()
{
    document.getElementById("list").onchange = output;
}​
</script>

<form>
<p>
 <select id = "list" name = "list" >

<option></option>
<option>link1</option>
<option>link2</option>
<option>link3</option>
<option>link4</option>
<option>link5</option>

</select>
</p>

</form>
于 2012-11-28T19:04:51.763 回答
0

这个问题很不清楚,这行得通吗?

document.getElementById("url").innerHTML = prefix + document.getElementById("url").innerHTML;
于 2012-11-28T19:05:00.610 回答
0

看这个演示:http: //jsfiddle.net/JFqrH/3/

HTML:

<form>
    <p>
       <select id = "list" name = "list" onchange ='output(this);' >    
          <option></option>
          <option>link1</option>
          <option>link2</option>
          <option>link3</option>
          <option>link4</option>
          <option>link5</option>
       </select>
   </p>
   <a id="url" href="/web/sso/bw/ostrfer.jsp">/web/sso/bw/ostrfer.jsp</a>
   <a id="url1" href="/web/sso/bw/ostrfer.jsp">/web/sso/bw/ostrfer1.jsp</a>
   <a id="url2" href="/web/sso/bw/ostrfer.jsp">/web/sso/bw/ostrfer2.jsp</a>
</form>​

JS:

function output (choice) {
   var index =  choice.selectedIndex;
   var prefix = "";
   if(index == 1) 
     prefix = "https://link1";    
   else if (index == 2) 
     prefix = "https://link2";        
  else if (index == 3) 
    prefix = "https://link3";       
  else if (index == 4) 
    prefix = "https://link4";       
  else if (index == 5) 
    prefix = "https://link5";    

   updateLink(document.getElementById("url"), prefix);
   updateLink(document.getElementById("url1"), prefix);
   updateLink(document.getElementById("url2"), prefix);
}​
function updateLink(url, prefix) {
   if(!url.getAttribute("postfix")) {// need to save orignal href as it will be replaced later
        url.setAttribute("postfix", url.getAttribute("href"));                
   }
   var postfix = url.getAttribute("postfix");
   url.innerHTML = prefix + postfix;
   url.href = prefix + postfix;    

}

您的代码中有多个语法错误。加a href=<span id = "url"></span>号是废话。它行不通。相反,您应该使用属性(请参阅getAttribute / setAttribute)。此外,使用 swithc 语句而不是 if/else 更简单。另一件事:onchange=output(this.form.liste);- 而不是这个,你可以使用onchange=output(this);它,因为它已经指向你的下拉元素。

于 2012-11-28T19:13:45.793 回答