zoukankan      html  css  js  c++  java
  • javascript操作常见的html标签

    几乎HTML所有标记都可以说是HTML的控件,如select, input, div, table等。html标签便捷的操作,深受大家的喜欢。现在的大部分网站都是ajax+json来进行数据传送。所以如何使用javascript来操作HTML控件,是我们的重中之重。下面我介绍下比较麻烦的几个控件
    //下拉列表的填充
    
     _showSchools: function (data) { //data代表是一个数据对象
    
                    var mySelect = document.getElementById("selectSchools"); //获取下拉框
                    mySelect.options.length = 0;
                    //将option添加到select标签里面
                    for (var index in data) {
                        var item = data[index];
                        var opp = new Option(item.SchoolName, item.name);  //第一个参数代表下拉框显示的内容,第二个代表下拉框选中的内容
                        opp.name = "option" + index;
                        mySelect.add(opp);
                    }
                },
    
    //下拉列表内容的获取
    var schoolId = document.getElementById("selectSchools").value;
    
    //我们平时是选中下拉框的值是选中的内容,而不是显示的内容,如何获取显示的内容呢,下面是获取下拉框的选中的显示内容
    function on_idmbzd_change(){ 
        var sel_obj=document.getElementById("idMbzd");
        var index=sel_obj.selectedIndex;
        alert(sel_obj.options[index].value);
        alert(sel_obj.options[index].text);
    }
    
    //单选按钮的内容的获取
     var chkObjs = document.getElementsByName("radio");
                    var checkvalue = null;
                    for (var i = 0; i < chkObjs.length; i++) {
                        if (chkObjs[i].checked) {
                            checkvalue = parseInt(chkObjs[i].value);
                        }
                    }
    
    //单选按钮的设置
    if (entity.SelectType == 1) document.getElementById("SelectType").checked = true;
    if (entity.SelectType == 0) document.getElementById("UnSelectType").checked = true;
    
    //多选框的设置
    setCheckBox: function (data) {
                    var courseList = document.getElementsByName("CourseList");
                    for (var i = 0; i < courseList.length - 1; i++) {
                        if (courseList[i].value==data) {
                            courseList[i].checked=true;
                        }
                    }
    
                },
    
    
  • 相关阅读:
    C语言丨博客作业10
    C语言博客作业09
    C语言博客作业08
    闽江学院软件学院2019-2020《创新思维》课程预告(20200412)
    C语言和数据结构的书单-再次推荐
    2019-2020创新思维初探(IT | Design |Think)书单(更新ING)
    闽江学院软件学院2016级JAVA构建之法-学生自学兴趣小组招募通知
    2014软件工程专业-职业能力调查(作业)
    软件第二次结对作业
    软件第一次结对作业
  • 原文地址:https://www.cnblogs.com/myhappylife/p/3453772.html
Copyright © 2011-2022 走看看