模拟顺风模式弹出窗口的切换单击（Flowbite）

Question

我正在使用 Tailwind CSS (Flowbite)。我希望当用户登陆页面时我的模式弹出窗口自动弹出，而不是等待用户单击按钮。

这是我的 jQuery 点击方法：

$("#mybutton").click();

 $(".mybutton").trigger('click');

这是模态按钮和模态。

 <button data-modal-target="crud-modal" id="mybutton"  data-modal-toggle="crud-modal"
        class="mybutton " type="button">
    Toggle modal
</button>

 <div id="crud-modal" tabindex="-1" aria-hidden="true" 
         class="hidden overflow-y-auto overflow-x-hidden fixed">
        <div class="relative p-4 w-full max-w-md max-h-full">
            <!-- Modal content -->
            <div class="relative bg-white rounded-lg shadow dark:bg-gray-700">
                <!-- Modal header -->
                <div class="flex items-center justify-between p-4 md:p-5 border-b rounded-t dark:border-gray-600">
                    <h3 class="text-lg font-semibold text-gray-900 dark:text-white">
                        Create New Product
                    </h3>
                    <button type="button">
                        <span class="sr-only">Close modal</span>
                    </button>
                </div>
                
            </div>
        </div>
    </div>

Answer 1

我认为你做得对。 两者

$("#mybutton").click();

或

$(".mybutton").trigger('click');

将触发模式打开。

你还可以使用jquery超时，例如等待2秒：

$( document ).ready(function() {
  setTimeout(function () {
    FlowbiteInstances.getInstance("Modal", "crud-modal").show();
    // or replace this with the button click
  }, 2000);
});

如果您想访问 Flowbite 实例，请检查

实例管理器。