通过 JQuery 调用不显示引导模式窗口

Posted 2023-02-22

技术标签:

【中文标题】通过 JQuery 调用不显示引导模式窗口【英文标题】：Bootstrap Model Window Not Showing by Calling Through JQuery 【发布时间】：2019-05-10 20:44:52 【问题描述】：

我想要做的是通过使用 jquery 调用弹出一个引导 js 模型

$("#id").modal("show")

但无论如何它都不起作用，link 中提到了几种情况，但在我的情况下没有一个起作用。

我也浏览了以下链接

bootstrap model is not working

Bootstrap modal window not showing

calling to bootstrap model for a link

Bootstrap modal - popup window not showing

https://getbootstrap.com/docs/4.0/components/modal/

但我无法获得任何帮助，我可以通过有一个额外的按钮并通过 jquery 调用按钮的 click() 函数来触发模型，这工作正常但不是模态案例。

我的模态代码在这里

<div class="modal fade" id="addLocationTagModel" tabindex="-1" role="dialog" aria-labelledby="myModalLabelLocation">
<div class="modal-dialog" role="document">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" id="idButtonCloseLocation" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="myModalLabelLocation">Enter Location</h4>
        </div>

        <div class="modal-body">

            <div class="row">
                <div class="col-lg-9 col-md-9 col-sm-12 col-xs-12">                                          
                    <div class="form-group">

                        <?php
                        $preferredLocation = "";
                        if (strtolower(getUserPreferredLocation($row_user, $conn)) !== "no") 
                            $preferredLocation = getUserPreferredLocation($row_user, $conn);
                        
                        ?>
                        <input type="text" class="form-control" value="<?php echo $preferredLocation; ?>" placeholder="Location" id ="locationSuggested" name="locationSuggested" />
                        <span>
                            <span id="suggesstionBoxLocation" ></span>            
                        </span> 

                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12">                                           
                    <div class="pLace-order">
                        <button type="button" name="buttonLocation" onclick="getTagSelected();" class="btn btn-success" value="submit">Submit</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

jquery 调用在这里

<script>


function detachStore(url)

//alert(url);
//document.getElementById("buttonDeleteStore").click(); // Click on the checkbox
// For Testing Purpose to set the data-target

jQuery.noConflict();
$(document).ready(function () 

  $("#addLocationTagModel").modal("toggle");  
alert("Hello");
    //$("#buttonDeleteStore").click();


  // $('#addLocationTagModel').appendTo("body").modal('show');

);

下面是 html 和混合 PHP 代码，我在元素调用上有 onclick 功能，效果很好。

<td>
                                <?php
                                $i = 1;
                                foreach (unserialize($row['store_id']) as $store_id) 

                                    $stores = $conn->query("select * from tb_stores where ID = " . $store_id);

                                    while ($stores_row = $stores->fetch_assoc()) 
                                        $store_price = $conn->query("select * from tb_add_price_of_products where product_id=" . $row["ID"] . " and store_id=" . $stores_row["ID"]);
                                        $store_price_row = $store_price->fetch_assoc();
                                        //echo $store_price_row["price"];

                                        if ($i == 1) 
                                            echo "<a href='#' data-toggle='modal' title='$"
                                            . $store_price_row["price"] . "-" . $stores_row["location"] . "'"
                                            . " onclick=\"detachStore('" . $url . "product-registry?action=delete-store&product_id=". $row["ID"] . "&store_id=" . $stores_row["ID"] . "');\" >" 
                                            . $stores_row['name'] . "</a>";
                                         else 
                                            echo ", <a href='#' data-toggle='modal' title='$"
                                            . $store_price_row["price"] . "-" . $stores_row["location"] . "'"
                                            . " onclick=\"detachStore('" . $url . "product-registry?action=delete-store&product_id=". $row["ID"] . "&store_id=" . $stores_row["ID"] . "');\" >" 
                                            . $stores_row['name'] . "</a>";
                                        
                                        $i++;
                                    
                                
                                ?>
                                <button type="button" id="buttonDeleteStore" data-toggle="modal" data-target="#add_price_modal">Button</button>
                            </td>

我已经花了几个小时，甚至没有 javascript 错误，可能是我在某个地方做错了什么，如果有人能把它拉出来，将不胜感激。

【问题讨论】：

【参考方案1】：

我正在浏览其他帖子

TypeError: $(...).modal is not a function with bootstrap Modal

我换了