bootstrap-modal：弹出modal时input的checked的状态无法改变 | | input获取焦点不生效

最新推荐文章于 2023-03-15 09:39:06 发布

彩笔_小qing

最新推荐文章于 2023-03-15 09:39:06 发布

阅读量2.1k

点赞数

分类专栏： bootstrap 文章标签： bootstrap modal input checked prop

本文链接：https://blog.csdn.net/qq_31164127/article/details/73250613

版权

当使用Bootstrap Modal时，通过JS修改的input复选框checked状态无法实时显示。原因是input、textarea等元素的checked属性是固有属性，需要使用prop()方法来正确操作。同时，实现modal弹出时input自动获取焦点也是一个常见需求。

摘要由CSDN通过智能技术生成

1.每次弹出modal时，用 js 修改的 checked 状态不能实时更新

<div class="modal fade" tabindex="-1" role="dialog">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

彩笔_小qing

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
2
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

bootstrap模态框之加载页面至modal-boby

03-04

4443

一、效果图思路：使用$("#reserveForm").html(result); result为Ajax请求controller所返回的页面二、预订会话框Modal<button id="reserveDialog" class="btn btn-primary btn-large" href="#reserveDialogModal" data-toggle="modal">

JS -- Bootstrap -- 如何实现模态框效果（点击按钮弹出交互框）-- 19

支棱起来

11-26

848

点击弹出模态框的按钮： <div id="response-excel-export-div" title="Export Response Excel" style="cursor:pointer;position:absolute;top:7px;right:40px" data-toggle="modal" data-target="#select-sg-modal-id"> <span class="fa fa-file-excel-o" ></span>

2 条评论您还未登录，请先登录后发表或查看评论

BootStrap模态框和select2合用时input无法获取焦点的解决方法

08-29

在bootstrap的模态框里使用select2插件,会导致select2里的input输入框没有办法获得焦点,没有办法输入。怎么解决这个问题呢？下面小编给大家带来了BootStrap模态框和select2合用时input无法获取焦点的解决方法，一起看看吧

bootstrap select2 php,完美解决BootStrap模态框和select2合用时input无法获取焦点问题

weixin_39828198的博客

03-21

168

在bootstrap的模态框里使用select2插件,会导致select2里的input输入框没有办法获得焦点,没有办法输入。怎么解决这个问题呢？下面小编给大家带来了BootStrap模态框和select2合用时input无法获取焦点的解决方法，一起看看吧在bootstrap的模态框里使用select2插件,会导致select2里的input输入框没有办法获得焦点,没有办法输入.解决方法:把页面中...

在BootStrap的modal中使用Select2

weixin_30588729的博客

12-30

120

在普通页面中使用Select2是正常的，但是在Modal中使用就发现了一些问题，首先如果在页面加载完成后就调用 $(".select2").select2();是会有问题的，你会发现Modal框中的select显示不正常，正确的做法是要改成 $("#editModal").on("shown.bs.modal", function(){ $(".select2").sel...

input复选框不可改变默认勾选状态

nunumaymax的博客

07-30

2146

input复选框不可改变默认勾选状态 //复选框默认为勾选状态，并不可改变 <input type="checkbox" checked="checked" onclick="return false;">

SptingMVC整合bootstrap-table 初始化数据-自定义搜索-弹出模态框

weixin_44033084的博客

10-11

220

bootstrap-table 初始化数据-自定义刷新今天在写项目的时候遇见一个bootstrap自定义搜索的问题正好记录一下废话不多直接上代码初始化数据 HTML <table id="mytab"></table> JS $(function(){ // 这里是生成自定义操作按钮 function addFunctionAlty(value, row, index) { var id=index;

关于bootstrap-table-tree封装

成小新的博客

01-18

1万+

(function ($) { 'use strict'; var sprintf = function (str) { var args = arguments, flag = true, i = 1; str = str.replace(/%s/g, function () {

modal框里input无法聚焦

qq_42927276的博客

02-21

960

在项目中遇到modal框开启的情况下，再弹出一个elementUI的el-input，发现el-input无法聚焦，无法输入。解决方法：删除modal框的tabIndex

modal模态框里的表单输入框，使用focus()方法无法自动获得焦点

weixin_42190844的博客

09-08

1375

在写界面的时候，要写增加功能。自然而然的写了一个弹框包含一个表单。因为嫌弃每次打开都需要点击输入框才能输入比较麻烦，所以想加一个自动聚焦的功能。结果就试了半天也不行。正常的想法就是，给el-input注册一个ref，然后使用focus方法来聚焦。这里遇到的问题就是，如下图，我在打开窗口的事件里，调用 this.$refs[‘nameInput’].focus() 发现并没有自动聚焦，怀疑是不是dom更新的问题，就加上了 $nextTick。然后发现还是没有效果。查了一下，有可能是调用时机的问题.

checkbox 选中和取消切换没效果

一叶知春秋

07-25

4775

如果你引入的JQuery是1.6+的版本那么这个方法应该合适你：例如： html页面如下：你爱好的运动是？全选/全不选足球篮球羽毛球 $("#CheckedAll").click(function () { if ($(this).is(":

CTreeCtrl遍历和checkBox使用及初始化时SetCheck无效解决办法

b695886658的博客

08-24

562

CTreeCtrl

解决复选框checked=checked无效问题