Javascript警报框无法正常工作

时间:2014-10-23 04:27:34

标签: jquery html5

以下程序应该在点击" First"时弹出警告框。当它在浏览器中运行时

<!doctype html>

<html lang="en">

<head>
       <meta charset="utf-8"/>

       <script src="attach.js"> </script>  
</head>

<body> 
     <div id="wrap">
              <p id="1a"> First </p>
              <p id="2b"> Second </p>
              <p id="3c"> Third </p>
              <p id="4d"> Fourth </p>
     </div>

</body>
</html>

attach.js文件是:

function getit()
{
      document.querySelector('#1a').onclick=fun2;
      document.write('Hi');
}

function fun2()
{
      alert('Yup!');
}

document.write('here');
window.onload=getit;

我在chrome中获得的输出是:

here
First
Second
Third
Fourth

问题是,在浏览器屏幕上点击&#34; First&#34;时,没有警告框说“哟”。另一个问题是为什么我们没有看到&#39;嗨&#39;被打印在屏幕上。

3 个答案:

答案 0 :(得分:0)

关于我唯一改变的是1a到aTest的名称。在那之后工作。

<!doctype html>

<html lang="en">

<head>
       <meta charset="utf-8"/>

</head>

<body> 
     <div id="wrap">
              <div id="aTest" class="1a"> First </div>
              <p id="2b"> Second </p>
              <p id="3c"> Third </p>
              <p id="4d"> Fourth </p>
     </div>

       <script> 
            function getit()
            {
                var a = document.querySelector('#aTest');
                a.onclick = fun2;
                //document.write('Hi');
            }

            function fun2()
            {
                  alert('Yup!');
            }

            document.write('here');
            window.onload = getit;
       </script>     
</body>
</html>

答案 1 :(得分:0)

为什么不使用jQuery来实现相同的结果。

$(document).on('click','#1a',function(){
    fun2();
    console.log('hey');
})

function fun2(){
  alert('Yup!');
}

答案 2 :(得分:0)

你的JS的问题是ID中有一个“1”,需要使用Unicode代码进行转义才能使querySelector正常工作。您还需要删除 document.write('Hi'),因为它会覆盖您的HTML

试试这个

function getit() {
  document.querySelector('#\\31 a').onclick = fun2
}

Plunker:http://plnkr.co/edit/ShUF3LzguShG4OlzrWQZ?p=preview