<!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. <Django>一些小知识

    ''' ORM import pymysql pymysql.connect( ... ... ) 1.不同的程序员写的SQL水平参差不齐 2.执行效率也参差不齐 python语法 --自动翻译 -- ...

  2. HDU 5726 线段树+dp

    题意:给出一个序列,后q次询问,求给定区间gcd及整个序列有多少个序列的gcd和这个值相同 首先线段树维护区间gcd建树,之后预处理出每个gcd有多少个子序列,这时需要dp, dp[i][tmp]表示 ...

  3. 通过快递100获取快递单号，结合c-lodop热敏纸打印 – 通过菜鸟ISV/自研ERP使用菜鸟电子面单

    https://www.1024cc.cn/index.php/2019/04/29/%E6%89%93%E5%8D%B0%E7%94%B5%E5%AD%90%E9%9D%A2%E5%8D%95/ 打 ...

  4. Jmeter----请求依赖之边界值提取器

    填写左边界和右边界 引用变量名就是要存储的变量名词

  5. Servlet共享数据

    共享数据: 1.域对象:有一个作用范围的对象,可以在范围内共享数据 2.request域:代表一次请求范围,一般用于请求转发的多个资源中共享数据 方法: 1.存储数据:setAttrbute(Stri ...

  6. 如何收集项目日志统一发送到kafka中？

    上一篇(http://qindongliang.iteye.com/blog/2354381 )写了收集sparkstreaming的日志进入kafka便于后续收集到es中快速统计分析,今天就再写一篇 ...

  7. Pod 私有仓库构建

    Pod 私有仓库构建 创建`私有仓库索引库`(iOS) 添加`私有仓库索引库`到本地repo管理 创建自己的`组建库工程 上传`组建库工程`到`私有仓库索引库` App工程调用`组建库工程` 目的 私 ...

  8. c# 给文件/文件夹 管理用户权限

    public class PermissionManager { /// <summary> /// 为文件添加users,everyone用户组的完全控制权限 /// </summ ...

  9. excel破解工作簿与工作表保护

    1.工作簿保护 1.1.使用压缩文件打开文件

  10. 尚学python课程---14、python中级语法

    尚学python课程---14.python中级语法 一.总结 一句话总结: var[1:5] 访问模式:比如字符串,比如列表元祖,字典等 del 删除模式:比如列表.元祖.字典 1.Python的N ...