2014-09-13 3 views
0

Я пытаюсь создать веб-страницу, чтобы при нажатии ссылки она не попадала на страницу, она меняет цвет фона предложения в div, а также изменяет предложение , Пока это идет на страницу, которая является подделкой.Bgcolor change div со ссылкой

HTML:

<html> 
<head> 
</head> 
<body> 
<div id="div1"> 
Sentence 1 
</div> 
<div id="div2"> 
<a href="answer.html" id="c_link" onmousedown="mousedown()">Click to change bgcolor!</a> 
</div> 
<script type="text/javascript" src="jsdemo.js"></script> 
</body> 
</html> 

JavaScript- jsdemo.js:

function mousedown() 
{ 
document.getElementById('div1').style.backgroundColor="#CCCCCC"; 
document.div1.innerHTML = "Sentence 2" 
} 

ответ

0

Второе предложение, кажется, не найти DIV, сделать это:

function mousedown() { 
    var container = document.getElementById('div1'); 
    container.style.backgroundColor = "#CCCCCC"; 
    container.innerHTML = "Sentence 2"; 
} 

И изменить ссылка на

<div id="div2"> 
    <a href="javascript:void(0);" id="c_link" onmousedown="mousedown()">Click to change bgcolor!</a> 
</div> 

я увидел другой ответ, и я обнаружил, что этот ответ до сих пор действует в двух предположениях:

  • Вам не нужно будет применять другие обработчик событий для этого элемента и события;
  • Вам нужна совместимость со старым браузером.

https://developer.mozilla.org/en-US/docs/Web/API/EventTarget.addEventListener#Older_way_to_register_event_listeners

0

Избавиться от этого обработчика рядных событий, и использовать

var div1 = document.getElementById('div1'); 
document.getElementById('c_link').addEventListener('click', function(e) { 
    e.preventDefault(); // Avoid following the link 
    div1.style.backgroundColor = "#CCCCCC"; 
    div1.innerHTML = "Sentence 2"; 
}); 

Demo

0

Попробуйте это, а также, почему ваш <a> тега имеет href ведущий к другому страница?

<a href="javascript: void(0)"/> 
<div>Sample text</div> 

<script> 
    var a = document.getElementsByTagName("a")[0]; 
    var div = document.getElementsByTagName("div")[0]; 
    a.onclick = function() { 
    div.style.backgroundColor = "#cccccc"; 
    } 

</script> 
0

Его лучше изменить событие onmousedown на событие onclick.

var link = document.getElementById('c_link'); 

link.onclick = function(e){ 
    e.preventDefault(); 
    var div1 = document.getElementById('div1'); 
    div1.style.backgroundColor = "#CCCCCC"; 
    div1.innerHTML = "Sentence 2"; 

} 
Смежные вопросы