-2

シナリオは次のとおりです。ユーザーがドロップダウンリストからエントリを選択します。関連するエントリを参照して、に存在するWebパスの新しいプレフィックスを作成します。しかし、私が抱えている問題は、がリンク部分として解釈されないため、リンクが生成されないことです。ユースケース：ユーザーがdropDown-listからlink1を選択した場合、結果は次のようになります：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

問題の原因となっている複数の構文エラーがあります。

初め

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

2番

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

第3

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

第4

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

構文エラーがあっても、コードは正しくありません。<span>内にhrefを含めるのは適切ではありません<a>。

このjsFiddleデモを試してください-コードの動作方法を変更しました。スパンは使用しません。

完全な固定コード：

<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を参照）。また、if/elseの代わりにswithcステートメントを使用する方がはるかに簡単です。別のこと：onchange=output(this.form.liste);-これの代わりにonchange=output(this);、ドロップダウン要素をすでに指しているので使用できます。

于 2012-11-28T19:13:45.793 に答える
0

このスニペットを保存できます：

/web/sso/bw/ostrfer.jsp

そのような定数として：

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

次に、ユーザーがリンクを選択すると、次のように追加できます。

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

これにより、アンカータグの「href」属性が新しいURLで更新されます。

このフィドルで実際の動作を確認できるように、テスト例を設定しました。ブラウザの開発者ツールでリンクを調べると、コードを実行した後、href（元々は空の文字列 ""）が"https://link1/web/sso/bw/ostrfer.jspに更新されていることがわかります。 "。

お役に立てれば。

于 2012-11-28T19:17:51.203 に答える