文档章节

vue中一个关于input元素的小坑

fattypanda
 fattypanda
发布于 2016/12/08 11:31
字数 317
阅读 565
收藏 1

        客户要求做了一个手机端的网站(使用vue2.0),要求能在大部分手机上没有问题,还要添加百度地图,扩展自己的功能。比如,我在百度地图生成了自己的搜索控件(搜索嘛,一定会有一个input元素)。

        当时直接使用的原生JS创建的DOM元素,并生成了一个input元素进行输入,但发现在safari浏览器不并不能输入。于是打开开发者工具进行调试,最后发现给input加上type="text"属性就可以输入了!!!???

        input的"type"不是默认就是"text"???

        接下来我又去创建了一个html文件就行测试,然后发现并不是safari的锅。

<html>
  <body>
    <!-- chrome,ie,safari都能输入 -->
    <input type="text">
    <!-- chrome,ie,safari都能输入 -->
    <input>
    <script>
      // chrome,ie,safari都能输入
      document.body.appendChild( document.createElement( 'input'));
    </script>
  </body>
</html>

        后来我又在vue2.0的环境下进行以上几测试,发现原来只是在vue里面才会出现这个问题,虽然并不明白为什么,但,个人猜测,可能是'.vue'进行解析编译时,进行了一些处理的原因吧。

© 著作权归作者所有

共有 人打赏支持
fattypanda
粉丝 0
博文 10
码字总数 2767
作品 0
渝北
程序员
私信 提问
Vue.js 快速入门

什么是Vue.js vue是法语中视图的意思,Vue.js是一个轻巧、高性能、可组件化的MVVM库,同时拥有非常容易上手的API。作者是尤雨溪,写下这篇文章时vue.js版本为1.0.7 准备 我推荐使用sublime t...

鼎六智能
2016/09/30
1K
0
用 React 和 Vue 创建了两个完全相同的应用后,发现了这些差异

译者 jonjia 爱贝睿技术团队 在工作中使用 Vue 一段时间后,对它的工作原理有了相当深入的了解。然而,我很想知道篱笆另一边的草地是什么样 - React。 我已经阅读了 React 文档,也观看了一些...

爱贝睿技术团队
2018/08/03
0
0
13、优化轮播图组件与vue深度处理器

前言:上篇讲了vue里面轮播图组件的使用,还有有个小问题可以优化一下。 github:https://github.com/Ewall1106/mall 1、焦点问题 我们看到这里的焦点会有一个默认的颜色,改变这个焦点颜色也...

Ewall_
2018/06/22
0
0
面向Vue新人:使用Vue自定义指令来完善一个Select组件

本篇文章教大家写一个非常简单的Select组件,想必很多人都写过Select,毕竟它太常用了,但是本篇文章的示例使用到了Vue的自定义指令,如果你对Vue自定义指令不怎么熟悉的话,本篇文章或许会让...

limingru
2018/05/23
0
0
浅析Vue.js 中的条件渲染指令

1 应用于单个元素 Vue.js 中的条件渲染指令可以根据表达式的值,来决定在 DOM 中是渲染还是销毁元素或组件。 html: <div id="app"><p v-if="type===1">拌面</p><p v-else-if="type===2">扁肉......

开元中国2015
2018/12/11
0
0

没有更多内容

加载失败,请刷新页面

加载更多

数据库篇一

数据库篇 第1章 数据库介绍 1.1 数据库概述  什么是数据库(DB:DataBase) 数据库就是存储数据的仓库,其本质是一个文件系统,数据按照特定的格式将数据存储起来,用户可以对数据库中的数据...

stars永恒
13分钟前
1
0
Intellij IDEA中设置了jsp页面,但是在访问页面时却提示404

在Intellij IDEA中设置了spring boot的jsp页面,但是在访问时,却出现404,Not Found,经过查找资料后解决,步骤如下: 在Run/Debug Configurations面板中设置该程序的Working Directory选项...

uknow8692
昨天
2
0
day24:文档第五行增内容|每月1号压缩/etc/目录|过滤文本重复次数多的10个单词|人员分组|

1、在文本文档1.txt里第五行下面增加如下内容;两个方法; # This is a test file.# Test insert line into this file. 分析:给文档后增加内容,可以用sed 来搞定;也可以用while do done...

芬野de博客
昨天
2
0
深入理解JVM—JVM内存模型

深入理解JVM—JVM内存模型 我们知道,计算机CPU和内存的交互是最频繁的,内存是我们的高速缓存区,用户磁盘和CPU的交互,而CPU运转速度越来越快,磁盘远远跟不上CPU的读写速度,才设计了内存...

onedotdot
昨天
2
0
MVC、MVCS、MVVM、MVP、VIPER等这么多架构模式哪一个好呢?

在项目开启阶段,其中一个很重要的环节就是选架构。 那么面对目前已知的这么多架构模式我们该怎么选择呢?这确实是个很让人头疼的问题! 下面我就在这里梳理一下目前常见的一些架构模式。 先...

Java干货分享
昨天
8
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部