<!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. 再次封装ajax函数，统一入口

    根据API写网页的时候,每个页面都需要ajax请求,每次都写一大堆请求,配置什么的太麻烦,于是打算封装一个ajax函数,统一调用: 开始时是使用return返回ajax,如下: function cr ...

  2. iOS开发系列-UIImageView的contentMode

    typedef NS_ENUM(NSInteger, UIViewContentMode) { UIViewContentModeScaleToFill, UIViewContentModeScale ...

  3. vue v-show指令

    demo: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

  4. node---处理get请求

    const http=require('http') const querystring=require('querystring') const server = http.createServer ...

  5. Cut the Sequence

    Cut the Sequence 有一个长度为n的序列\(\{a_i\}\),现在求将其划分成若干个区间,并保证每个区间的和不超过m的情况下,每个区间的最大值的和的最小值,\(0 < N ≤ 1 ...

  6. BigDecimal踩过的大坑

    通常Java中涉及金钱相关的计算为了保持精度,会采用BigDecimal来实现,但是BigDecimal中创建BigDecimal类对象的时候,如果使用直接new的话,必须是String类型的参数,否 ...

  7. 0929CSP-S模拟测试赛后总结

    70分31名滚粗. 赛后发现赛时得到的分数全都是暴力分…… T2打的三分跑都没跑……边界设错了……赛后稍微调了调多了15分…… 据说有15分的暴力分,那么另外15分就是只有一种选择的情况了…… (如果 ...

  8. 0910CSP-S模拟测试赛后总结

    %%%外校参加国赛大佬kai神-rank1 ---------------以上选手实力开挂---------------- %%%skyh.NC锅-rank2 %%%神牛170-rank4 %%%迪哥 ...

  9. 0908CSP-S模拟测试赛后总结

    我早就料到昨天会考两场2333 话说老师终于给模拟赛改名了啊. 距离NOIP祭日还有60天hhh. 以上是废话. %%%DeepinC无敌神 -rank1 zkt神.kx神.动动神 -rank2 有钱 ...

  10. IDEA被删除的模块在编译时会再次出现

    工程根目录下.idea文件->compiler.xml,删除多余的model,workspace.xml->删除带有无用的target标签