簡體   English   中英

外部鏈接不工作html / javascript

[英]external links not working html/javascript

我在我的客戶網站上創建了一個點擊顯示選項。 哪個在那里工作得很好。 其各自的代碼如下。

<style>
a{padding:0;margin:0;color:#009cbb;font-weight:bold;text-decoration:none;}
</style>
<p>
<div><a href="#welcome" onclick="toggle_visibility('welcome');">Welcome</a></div>
<div id="welcome" style="display:none;">This is test</div>

<div><a href="#focus" onclick="toggle_visibility('focus');">Focus</a></div>
<div id="focus" style="display:none;">This is test2
</div>

<div><a href="#cataracts" onclick="toggle_visibility('cataracts');">Cataracts</a></div>
<div id="cataracts" style="display:none;">This is test2
</div>
</p>
<script type="text/javascript">
function toggle_visibility(id) {
var e = document.getElementById(id);
if(e.style.display == 'block')
e.style.display = 'none';
else
e.style.display = 'block';
}
</script>

當我從外部頁面鏈接test1它應該顯示test1並保持關閉另外2,但問題是當我點擊鏈接時它顯示所有這些已關閉。

鏈接代碼是

<a href="http://website.com/page.php#welcome" style="color:#009bd9;text-decoration:none;">Read More ></a>

當有人點擊時,請幫助我閱讀更多信息,它會將歡迎信息顯示為已打開,其他人則顯示已關閉。

謝謝

試試這個 - 在Windows上的IE8,Chrome32和Fx 24中進行測試

現場演示 現場演示與哈希

function toggle_visibility(link) {
  var id = link.hash.substring(1);
  var obj = document.getElementById(id);
  if (obj) obj.style.display = obj.style.display == "block"?"none":"block";
  return false;
}
window.onload=function() {
  var id = location.hash?location.hash.substring(1):"";
  if (id)  document.getElementById(id).style.display="block";
}

在每個鏈接上使用這種格式(也應該重構為不引人注目)

onclick="return toggle_visibility(this);"

請注意(這)

我終於找到了你想要的東西!

因此,如果鏈接以#element_id結尾,您希望在頁面加載時打開元素。

您的腳本標記目前:

<script type="text/javascript">
    function toggle_visibility(id) {
    var e = document.getElementById(id);
    if(e.style.display == 'block')
    e.style.display = 'none';
    else
    e.style.display = 'block';
    }
</script>

將其更改為:

<script type="text/javascript">
    function toggle_visibility(id) {
        var e = document.getElementById(id);
        if(e.style.display == 'block') e.style.display = 'none';
        else e.style.display = 'block';
    }

    var parts = window.location.split('#'),
        hash = '';
    if (parts.length > 1) {
        hash = parts[1];
    }    
    if (hash !== '') {
        toggle_visibility(hash);
    }
</script>

編輯:

window.location.hash顯然在任何地方都受到支持。 您可能希望使用它而不是string.split()

小提琴

window.onload = function(){
        toggle_visibility(window.location.hash.substring(1));
}

雖然我沒有清楚地理解你的問題,但我已根據我的假設修改了你的功能。

function toggle_visibility(id) {
    var e = document.getElementById(id);
    if (e.style.display == 'block' || e.style.visibility == 'visible') {
        e.style.display = 'none';
        e.style.visibility = "hidden";
    } else {
        e.style.display = 'block';
        e.style.visibility = 'visible';
    }
}

請告訴我們您需要的修改內容。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM