jquery获取和设置表单数据

1.需求

正好做到设置和获取表单数据的功能，做个整理

2.计划安排

3.计划实施

1.获取值

<!--1获取普通文本框的值-->
<input type="text" id="a1"/>

<!--btn-->
<button id="submit">按钮</button>
<script src="jquery-1.8.3.min.js"></script>
<script>
    $('#submit').click(function () {
        console.log($('#a1').val());
    })
</script>

<!--2.获取checkbox是否打勾-->
<input type="checkbox" id="a1"/>

<!--btn-->
<button id="submit">按钮</button>
<script src="jquery-1.8.3.min.js"></script>
<script>
    $('#submit').click(function () {
        //打勾返回true,没有打勾返回false
        console.log($('#a1').is(":checked"));
    })
</script>

<!--3.获取radio选中的value值-->
<input type="radio" name="age" value="1"/>
<input type="radio" name="age" value="2"/>
<input type="radio" name="age" value="3"/>

<!--btn-->
<button id="submit">按钮</button>
<script src="jquery-1.8.3.min.js"></script>
<script>
    $('#submit').click(function () {
        console.log($('input[name="age"]:checked').val());
    })
</script>

<!--4.获取选中的下拉框的值-->
<select name="" id="select">
    <option value="1">111</option>
    <option value="2">222</option>
    <option value="3">333</option>
    <option value="4">444</option>
</select>

<!--btn-->
<button id="submit">按钮</button>
<script src="jquery-1.8.3.min.js"></script>
<script>
    $('#submit').click(function () {
        console.log($('#select').val());

       $("#childmodel").find("option:selected").text();

}) </script>

2.设置值

<!--1设置普通文本框的值-->
<input type="text" id="a1"/>

<!--btn-->
<button id="submit">按钮</button>
<script src="jquery-1.8.3.min.js"></script>
<script>
    $('#a1').val(1111)
</script>

<!--2.设置checkbox打勾-->
<input type="checkbox" id="a1"/>

<!--btn-->
<button id="submit">按钮</button>
<script src="jquery-1.8.3.min.js"></script>
<script>
    $('#a1').attr('checked','checked');
</script>

<!--3.设置radio选中-->
<input type="radio" name="age" value="1"/>
<input type="radio" name="age" id="a2" value="2"/>
<input type="radio" name="age" value="3"/>

<!--btn-->
<button id="submit">按钮</button>
<script src="jquery-1.8.3.min.js"></script>
<script>
    $('#a2').attr('checked','checked');
</script>

<!--4.设置选中的下拉框的值-->
<select name="" id="select">
    <option value="1">111</option>
    <option value="2">222</option>
    <option value="3">333</option>
    <option value="4">444</option>
</select>

<!--btn-->
<button id="submit">按钮</button>
<script src="jquery-1.8.3.min.js"></script>
<script>
    //设置value=4的值为选中
   $('#select').val('4');
//文本

var prov = document.getElementById(id);
for (var i = 0, len = prov.options.length; i < len; i++)
    if (prov.options[i].text==text)
        prov.selectedIndex = i;

</script>

4.总结 

一些小东西总是容易忘，记录下来方便查找

转载于:https://www.cnblogs.com/norm/p/6208253.html