Question

我有所有要求Jquery，Materialize.js坐在我的Js文件上面然而我收到警告openModal不是函数..我检查模态名称是对的，我可以运行Materialize.toast所以我知道Materialise.js是工作。使用按钮触发也不会调用模态。这是代码..

脚本：

arg is MyType

触发：

<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="/js/materialize.js"></script>
<script type="text/javascript" src="/js/video.js"></script>
<script src="/js/admin.js"></script>

模态：

<button data-target="modal1" class="btn modal-trigger">Modal</button>

JS：

    <!-- Modal Structure -->
    <div id="modal1" class="modal">
        <div class="modal-content">
            <h4>Modal Header</h4>
            <p>A bunch of text</p>
        </div>
        <div class="modal-footer">
            <a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">Agree</a>
        </div>
    </div>
</div>

Answer 1

Materialise函数需要Jquery Elements getElementById（） - 给我们DOM对象。

//You can either convert this Dom object to Jquery

var modal = document.getElementById('modal1');
var jquerymodal = $(modal);  //convert to jQuery Element
jquerymodal.openModal();


//Or just use Jquery Element like

$('#modal1').openModal();

Answer 2

导入materialize / dist文件夹中的缩小文件，而不是materialize / js。

运行： $（＆＃39;＃elementId＆＃39）的模态（）; $（＆＃39;＃elementId＆＃39）的模态。（＆＃39;显示＆＃39）;

只是这样才有效。

编辑：

事实上，它在生产环境中并没有起作用。

所以我这样做了：

(function( $ ) {

    $.fn.showModal = function() {

        var self = this;
        try {
            this.modal();
            self.modal('open');
        } catch (err) {
            try{
                self.openModal();
            } catch (err2) {
                console.error("Something went wrong - cannot open modal.");             
            }
        }
    }


    $.fn.hideModal = function() {

        var self = this;
        try {
            this.modal();
            self.modal('close');
        } catch (err) {
            try{
                self.closeModal();
            } catch (err2) {
                console.error("Something went wrong - cannot close modal.");                
            }
        }
    }


}( jQuery ));

仅使用：$（＆＃39;＃modal＆＃39;）。showModal（）

MaterializeCss模式错误openModal不是函数

2 个答案: