Javascript 如何使用jquery从链接属性更改引导模式大小？

我想知道是否可以通过从链接读取属性来更改引导模式大小。例如，在声明属性时，引导模式将从正常大小更改为更大的大小

xModal

因此jquery将侦听单击并启动类似于

        if($('a[attr='modal-size']') === "large"){
            $('#xModal').modal('show'); 
            $(".modal-dialog").html("modal-lg");
          }

---

我可以通过这个想法来成功编写代码吗？

您可以收听

show.bs.modal

事件，并与您一起更改宽度

数据模式宽度

值，如下所示：

HTML

<a data-toggle="modal" data-target="#xModal" data-modal-width="900">xModal</a>

---

我不会从这个数据属性中调用模态，原因很简单，正如您刚才所描述的，您无法真正控制模态切换之前发生的事情。 更好的方法是使用onclick事件或侦听 你可以做一些类似的事情：

<a  onclick="handleModal()" modal-size="large">xModal</a>

handleModal(){
if($('a[attr='modal-size']') === "large"){
            $('#xModal').modal('show'); 
            $(".modal-dialog").html("modal-lg");
          }
}

xModal
手足动物{
如果（$（'a[attr='modal-size']'）=“大”）{
$（'xModal'）.modal（'show'）；
$（“.modal dialog”）.html（“modal lg”）；
}
}

或：

xModal
$（函数（）{
$（'#x1'）.onclick（function（）{
如果（$（'a[attr='modal-size']'）=“大”）{
$（'xModal'）.modal（'show'）；
$（“.modal dialog”）.html（“modal lg”）；
} 
})
})

它看起来不错，但它给了我另一个问题。我使用模式

#xModal

作为动态模式，通过

href

发送url。因此，是否只有在检测到<代码>数据模式宽度时才可以切换模式宽度？是的，您可以将<代码>$（'#xModal'）替换为<代码>$（'[data modal with]'）。但是要小心，这个选择器的效率要低得多。您还可以添加一个特定的类：

xModal

和带有

$（'.modal custom width'）

的目标。Joh，这不起作用。它无缘无故地冻结了我的页面：（页面是否在两个选项中都冻结？

<a  onclick="handleModal()" modal-size="large">xModal</a>

handleModal(){
if($('a[attr='modal-size']') === "large"){
            $('#xModal').modal('show'); 
            $(".modal-dialog").html("modal-lg");
          }
}

 <a  id="x1" modal-size="large">xModal</a>

 $(function(){
  $('#x1').onclick(function(){
   if($('a[attr='modal-size']') === "large"){
                $('#xModal').modal('show'); 
                $(".modal-dialog").html("modal-lg");
   } 
 })
})