0

常に変化するリンクがあり、リンクが指している場所に応じて、入力テキスト フィールドにテキストを出力したいと考えています。たとえば、私のリンクは次のようになります。

<a onclick="main()" id="link" href="#foo">

または、同じリンクが次のように見える場合があります

<a id="link" href="#bar">

リンクが #foo にリンクしている場合、次のようになります

<input id="input" type="text" value="Hello World" />

リンクが #bar にリンクしている場合は、入力に Good Bye World の値が必要です。

どうすればこれを達成できますか。以下を試してみましたが、ユーザーがクリックするまでURLが変わらないのでうまくいかないと思います。そのため、まだ存在しないものを探しています。

function main() {
  var url = window.location.href;
  if (url.search("#foo") > 0) {
    document.getElementById("link").value = "#foo";
    document.getElementById("input").value = "Hello World";
  }
}

更新これは、1 つのリンクに含まれる可能性のあるハッシュ タグの一部のリストです。そして、リンクがクリックされたときに入力テキスト フィールドに表示される内容。

#work = Can't talk I'm at work
#home = I have kids I still can't talk
#bar = I'm busy getting drunk I can't talk
#bathroom = Listen you perv I'm not interested don't you get it.

ただし、元のサイトは example.com にあり、リンク先の上記のハッシュ タグのいずれかを持つことができるリンクがあることに注意してください。また、ユーザーがその 1 つのリンクをクリックすると、href のリンクの内容に応じて、入力フィールドに入力される内容が決定されます。

4

3 に答える 3

1

現在の URL のハッシュ部分を確認しようとしていますか? そのlocation.hash場合は 、クリックされたリンクの実際の属性を確認しようとしている場合は、getAttribute代わりに を使用する必要がありますか?

function main() {
    var hash = window.location.hash,
        inp  = document.getElementById("input");

    if (hash == '#foo') {
        inp.value = "Hello World";
    }else if (hash == '#bar') {
        inp.value = "Goodbye World";
    }else{
        inp.value = "Stick a fork in me";
    }
}

もちろん、これらのアンカーを閉じて、有効なマークアップを用意する必要があります。

編集：

インラインの onclick を削除して、次のようにすることができます。

$(window).on('hashchange', main);
于 2013-08-12T22:59:59.957 に答える
1

これは機能するはずですが、jsfiddle でテストすることはできません。うまくいけば、これはあなたが理解するのに役立ちます.

JS:

document.getElementById('link').onclick = function () {
    var url = window.location.href;
    if (url.indexOf("#foo") > -1) {
        document.getElementById("link").innerHTML = "#foo";
        document.getElementById("input").value = "Hello World";
    }
}

HTML:

<a id="link" href="#foo">link</a>
<input id="input">
于 2013-08-12T22:48:50.987 に答える
0

テキスト入力のIDを「hello」にして、次のようにします

function main(){
    if(url.indexOf("foo") != -1){
        document.getElementById("hello").value = "Hello World foo";   
    }else{
        document.getElementById("hello").value = "Hello World bar";  
    }
}

 <input type="text" id="hello" value="Hello World" />
于 2013-08-12T22:51:33.423 に答える