<!DOCTYPE html>

<html lang="zh">

<head>

    <title></title>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <script src="https://unpkg.com/vue/dist/vue.js"></script>

    <link href="../css/style.css" rel="stylesheet"> </head>

<body>

<div id="myApp">

    <h3>你最喜欢的NBA球星是：</h3>

    <select v-model="likedNBAStar" style="width:210px;">

        <option>科比</option>

        <option>詹姆斯</option>

        <option>哈登</option>

        <option>库里</option>

        <option>杜兰特</option>

    </select>

    <h3>我的全明星：</h3>

    <select v-model="likedNBAStars" multiple style="width:210px;height:210px;">

        <option>阿德托昆博</option>

        <option>怀特赛德</option>

        <option>阿尔德里奇</option>

        <option>戴维斯</option>

        <option>格里芬</option>

        <option>詹姆斯</option>

        <option>杜兰特</option>

        <option>巴特勒</option>

        <option>德罗赞</option>

        <option>哈登</option>

        <option>科比</option>

        <option>韦德</option>

        <option>伦纳德</option>

        <option>库里</option>

        <option>欧文</option>

        <option>保罗</option>

        <option>林树豪</option>

    </select>

    <h3>选择结果</h3>

    <p>我最最喜欢: {{ likedNBAStar }}</p>

    <p>我的全明星: {{ likedNBAStars }}</p>

</div>

<script>

    var myApp = new Vue({

        el: '#myApp',

        data: {

            likedNBAStar: null,

            likedNBAStars: [],

        },

        methods: {

        },

    });

</script>

</body>

</html>

表单下拉框select的更多相关文章

  1. asp.net MVC4 表单 - 下拉框

    1.下拉框代码方式 控制器内构建下拉项目: List<SelectListItem> list = new List<SelectListItem>(); list.Add(n ...

  2. struts2 jsp表单提交后保留表单中输入框中的值 下拉框select与input

    原文地址:struts2 jsp表单提交后保留表单中输入框中的值 下拉框select与input jsp页面 1     function dosearch() {2         if ($(&q ...

  3. JQuery操作下拉框 select

    要实现这种效果: html代码 1<script src="js/jquery-1.7.2.min.js"></script> 2 <table> ...

  4. 【jQuery获取下拉框select、单选框radio、input普通框的值和checkbox选中的个数】

    radio单选框:name属性相同 <input type="radio" id="sp_type" name="p_type" va ...

  5. 关于jQuery表单下拉selected设置无效的解决方案

    表单下拉选项使用selected设置,发现第一次默认选中成功,在页面不刷新的情况下,再次下拉,selected属性设置了,默认选中不生效 研究发现是浏览器兼容的问题 一,解决浏览器缓存问题,在HTML ...

  6. jQuery对下拉框Select操作总结

    jQuery对下拉框Select操作总结 转自网络,留做备用 jQuery获取Select元素,并选择的Text和Value: 1. $("#select_id").change( ...

  7. 下拉框select中option居中样式

    下拉框select中option居中样式 text-align:center;text-align-last:center;

  8. 在vue中的form表单中下拉框中的数据来自数据库查询到的数据

    文章目录 1.实现的效果: 2.前端html代码 3.js中的代码 4.后端的方法 1.实现的效果: 增加一个新的类型到数据库 2.前端html代码 需要注意的部分:prop后边是表单中的字段 v-m ...

  9. 吾八哥学Selenium(四)：操作下拉框select标签的方法

    我们在做web页面自动化测试的时候会经常遇到<select></select>标签的下拉框,那么在Python里如何实现去操作这种控件呢?今天就给大家分享一下这个玩法.为了让大 ...

随机推荐

  1. mysql安装总结

    #mysql安装# 安装工具:yum -y install gcc-c++ ncurses cmake make ncurses-devel # 拷贝配置文件到指定目录:rm -rf /etc/my. ...

  2. 更改idea启动内存信息

    1.到idea的安装目录的bin下,找idea64.exe.vmoptions 文件 2.更改参数 对应的参数解释: -Xms1024m    设置IDEA初时的内存大小,提高Java程序的启动速度. ...

  3. Response案例1_重定向

    import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.serv ...

  4. js只能输入数字和小数点

    1.文本框只能输入数字代码(小数点也不能输入)<input onkeyup="this.value=this.value.replace(/\D/g,'')" onafter ...

  5. 实时收集Storm日志到ELK集群

    背景 我们的storm实时流计算项目已经上线几个月了,由于各种原因迟迟没有进行监控,每次出现问题都要登录好几台机器,然后使用sed,shell,awk,vi等各种命令来查询原因,效率非常低下,而且有些 ...

  6. SPRING+JPA+Hibernate配置方法

    1.applicationContext.xml <?xml version="1.0" encoding="UTF-8"?> <beans ...

  7. grep每次读取多大的文本

    Most of the tools do not actually read a single line in from a file at a time, rather they use a buf ...

  8. 【JZOJ6353】给(ca)

    description analysis 很妙的\(DP\) 设\(f[i][j]\)表示已经放了\(i\)个叶子节点.根到当前节点走了\(j\)步向左的方案数 考虑调整\(DP\)方式,钦定伸出左儿 ...

  9. Jmeter-BeanShell断言：将数据库结果封装成list作为参数

    import com.alibaba.fastjson.JSON; import com.alibaba.fastjson.JSONObject; import com.alibaba.fastjso ...

  10. 贪心+MST——cf1095F

    开始看错求最短路了.. 但是MST的思路和最短路也差不多 就是先不考虑特殊边,用最小点做一个生成树 然后加入特殊边,进行一次krus即可 #include<bits/stdc++.h> # ...