llzmgjzhy 2021-04-30 15:42 采纳率: 50%
浏览 185
已采纳

ajax为什么不能在vue元素中使用

<div id="app">

    <input type="button" value="Get Server Time" id="btn">

</div>

<div id="showtime" class="displaybox"></div>
 
<script>
(function(){
 
    var btn = document.getElementById("btn");
    btn.addEventListener('click', getServerTime);
    var xhr = new XMLHttpRequest();
 
    function getServerTime() {
        var myurl = 'data.php';
        myRand = parseInt(Math.random() * 99999999);
        // 构造随机数,防止缓存问题
 
        var modurl = myurl + "?rand=" + myRand;
        xhr.open("GET", myurl);
        xhr.onreadystatechange = xhrResponse;
        xhr.send();
    }
 
    function xhrResponse() {
        if (xhr.readyState == 4 && xhr.status == 200) {
            var timeValue = xhr.responseText;
            
            document.getElementById('showtime').innerHTML = timeValue;;
        }
    }
    
<script>
    new Vue({
        el:"#app"
    })
</script>
})()
</script>

这是部分代码,我为input绑定了ajax函数,实现实时输出数据。

但是当div绑定了vue,就是添加了id="app",就导致绑定的ajax函数失效,id删除就正常输出了

这是为什么呀

  • 写回答

7条回答 默认 最新

  • 关注


    div绑定了vue,div的代码就变成vue的模板,不能再用  btn.addEventListener('click', getServerTime); 绑定事件
    也不要 document.getElementById('showtime').innerHTML = timeValue 这样修改元素属性

    都要改用vue对应的方法
     

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(6条)

报告相同问题?

悬赏问题

  • ¥15 调用函数时,无关变量的改变引起函数值的改变
  • ¥15 xy坐标转化为经纬度坐标
  • ¥15 一般三角模糊数的上界值和下届值取中值的多少比较合理?
  • ¥15 关于#python#的问题,请各位专家解答!
  • ¥20 Hbase启动失败,无法启动HMaster
  • ¥15 sqpingboot在父模块已经引入了mybatisplus 在子组件不写版本号还是报错
  • ¥20 Lumerical FDTD solutions 中模型的相对阻抗,有效介电常数和有效磁导率的实部和虚部的数据如何获得?
  • ¥100 sql reporting service 远程smtp服务器配置支持
  • ¥15 ppyoloe_r带角度目标检测,loss_cls没法收敛
  • ¥15 淘宝交易指数如何解读,其关联的数据指标是什么