jquery获取input选中值,jquery获取radio选中值,jquery获取select选中值,jquery获取checkbox选中值,jquery使用ajax异步提交表单数据

站长软件开发5个月前技术分享79
jquery获取input选中值,jquery获取radio选中值,jquery获取select选中值,jquery获取checkbox选中值,jquery使用ajax异步提交表单数据

jquery获取input值:

//<input name="myinput"/>
var inputValues = $('input[name="myinput"]').val();//利用name属性获取input值,更方便,也便于后面修改的时候赋值
$('input[name="myinput"]').val(111);//为name为myinput的input赋值

jquery获取radio选中值:

//<input type="radio" name="myradio" value="1" />
//<input type="radio" name="myradio" value="2" />
$('input[name="myradio"]:checked').val();//获取radio选中的值
$("input[name='myradio'][value=2]").attr("checked",true);//让name=myradio且value等于2的radio选中

jquery获取select选中值:

//<select name="myselect"><option value="1"></option><option value="2"></option></select>
$("select[name='myselect'] option[value='1']").attr("selected", true); //设置select选中的option
$("select[name='myselect']").val();//获取select选中值

jquery获取checkbox选中值:

//<input type="checkbox" name="mycheckbox" value="1"/>苹果 
//<input type="checkbox" name="mycheckbox" value="2"/>橘子 
//<input type="checkbox" name="mycheckbox" value="3"/>梨子 
//<input type="checkbox" name="mycheckbox" value="4"/>香蕉
var checked=[];//定义一个数组
$('input[name="mycheckbox"]:checked').each(function(){//遍历每一个名字为nodes的复选框,其中选中的执行函数
    checked.push($(this).val());//将选中的值添加到数组checked中
});

jquery使用ajax异步提交表单数据:

<form name="myform" method="post">
     <ul>
     <li class="l1">用户名:</li>
     <li class="l2"><input type="text" name="name"/></li>
     <li class="l1">密码:</li>
     <li class="l2"><input type="text" name="password"/></li>
     <li class="l1">类型:</li>
     <li class="l2">
         <select name="leixing">
    		<option value="0">选择类型</option>
    		<option value="1">管理员</option>	
    		<option value="2">审核员</option>	
         </select>
     </li>
     <li class="l1">是否毕业:</li>
     <li class="l2">
         <label>
             <input name="denglu" type="radio" value="1" /> <strong>否</strong>
        </label>
        <label>
            <input name="denglu" type="radio" value="2"/> <strong>是</strong>
         </label>
     </li>
     
     <li class="l3"><input type="submit" value="保存"/></li>
     </ul>
 </form>
//以上面form表单为例
$('form').submit(function(event) {
        // 阻止表单提交默认行为
        event.preventDefault();
        // 获取表单数据
        var formData = $(this).serialize();//此处内容对应表单里面的input (name:value)
        $.ajax({
          url: 'https://www.you_api.com/api',
          type: 'POST',
          data: formData,
          success: function(data) {
            // 处理成功响应
            consoel.log(data);
            if(data.code==200){
                
            }else{
                
            }
          },
          error: function(xhr, status, error) {
            // 处理错误响应
            console.log(xhr.responseText);
          }
        });
});



联系站长:

相关文章

uniapp富文本编辑器editor的使用,复制可用

uniapp富文本编辑器editor的使用,复制可用

关于uniapp富文本编辑器editor的使用,我会把HTML,css,js三部分代码都完整列出来,其实也是一个总结,因为官方教程有些不是很清楚,这里总结一下,方便大家使用:1、html部分:<...

【简单一行】使用js去掉空格方法-原生js代码实现JavaScript

【简单一行】使用js去掉空格方法-原生js代码实现JavaScript

【简单一行】使用js去掉空格方法-原生js代码实现JavaScript str为要去除空格的字符串:1、去掉所有空格:str=str.replace(/\s+/g,"");  &...

js把数字格式化为千分位兼容版,兼容小数(8,888.22)

js把数字格式化为千分位兼容版,兼容小数(8,888.22)

js把任意数字格式化为千分位/**  * 格式化为千分位  * @param num 当前值字符串  * @ret...

js实用函数之map()函数的使用,一分钟学会

js实用函数之map()函数的使用,一分钟学会

重点:map() 方法定义在JavaScript的Array中,它返回一个新的数组,数组中的元素为原始数组调用函数处理后的值。值得注意的是:1、map()函数不会对空数组进行检测;2、map...

原生js把时间戳转为日期格式年月日时分秒

原生js把时间戳转为日期格式年月日时分秒

原生js把时间戳转为日期格式年月日时分秒function parsetime(timestamp){     let timelength...

js获取m到n随机数,js获取随机整数,从0到10,从m到n任意数

js获取m到n随机数,js获取随机整数,从0到10,从m到n任意数

˂a class="reference-link" name="js获取从m到n的随机数"˃js获取从m到n的随机数function getRandomNumber(min, ma...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。