问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
开发者社区
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

看看我这个函数为啥没反应？

头像
spiritsmoon
    911
    <!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>IFE JavaScript Task 01</title>
  </head>
<body>

  <label>请输入北京今天空气质量：<input id="aqi-input" type="text"></label>
  <button id="button" onclick=span_click() >确认填写</button> 

  <div>您输入的值是：<span id="aqi-display">尚无录入</span></div>
  
<script type="text/javascript">

(function(){
  /*    
  在注释下方写下代码
  给按钮button绑定一个点击事件
  在事件处理函数中
  获取aqi-input输入的值，并显示在aqi-display中
  */
      function span_click(){
        var content=document.getElementById("aqi-input").value;
        docement.getElementById("aqi-display").innerHTML=content;
      }
  };   

})();

</script>
</body>
    javascript
    阅读 3.6k
    6 个回答
    得票最新
    头像
    leohxj
      678194448
      ✓ 已被采纳

      因为你使用了自执行函数，span_click函数的作用域被限制了。所以在全局作用域(window)下访问不到span_click函数，你把script标签中内容换成如下：

      function span_click(){
  var content=document.getElementById("aqi-input").value;
  document.getElementById("aqi-display").innerHTML=content;
}
      头像
      ctcx
        21
        新手上路，请多包涵
        (function(){
      span_click = function (){
        var content=document.getElementById("aqi-input").value;
        docement.getElementById("aqi-display").innerHTML=content;
      }
})();

        修改了一下，感觉比较多余，简单的做法就像楼上那样：

        
 function span_click(){
       var content=document.getElementById("aqi-input").value;
       docement.getElementById("aqi-display").innerHTML=content;
}
        头像
        xiadd
          2.6k41824
          span_click=(function(){
    function span_click(){
        var content=document.getElementById("aqi-input").value;
        document.getElementById("aqi-display").innerHTML=content;
    }  
  return span_click;
})();

          这样，虽然感觉没啥意义

          头像
          允哲
            -2
            新手上路，请多包涵

            1.多了个大括号的关闭。
            2.是document，不是docement。
            3.函数作用域，将其暴露到全局里。

            头像
            LL89757
              433139

              你这样找不到函数声明，建议还是手动绑定函数吧
              document.getElementById("button").onclick=span_click;

              头像
              某熊猫桑
                16.1k61547
                <!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>IFE JavaScript Task 01</title>
  </head>
<body>

  <label>请输入北京今天空气质量：<input id="aqi-input" type="text"></label>
  <button id="button" onclick="spanClick()">确认填写</button> 

  <div>您输入的值是：<span id="aqi-display">尚无录入</span></div>
  
<script type="text/javascript">

(function(document){
  /*    
  在注释下方写下代码
  给按钮button绑定一个点击事件
  在事件处理函数中
  获取aqi-input输入的值，并显示在aqi-display中
  */
      var spanClick = window.spanClick = function () {
          var content = document.getElementById("aqi-input").value,
              innerTarget = document.getElementById("aqi-display");
          innerTarget.innerHTML = content;
      }
  };   

})(document);

</script>
</body>

                这样？
                （不过还是感觉怪怪的……为什么要在一个匿名函数里写具名函数……直接挂到click事件上写匿名回调不就得了……）

                撰写回答
                你尚未登录，登录后可以
                • 和开发者交流问题的细节
                • 关注并接收问题和回答的更新提醒
                • 参与内容的编辑和改进，让解决方法与时俱进
                推荐问题