Question

您好StackOverflow和其他开发人员...... 所以。我真的很喜欢Materialise CSS，但它有时会让我感觉不舒服。我的网站上有一些选择元素，非常好，初始化工作正常并显示它们。然后我有另一个函数来填充选择，根据Materialize文档，我应该再次运行$('select').material_select();。不幸的是，当我第二次尝试调用该函数时，我收到错误Uncaught TypeError: $(...).material_select is not a function。

我无法理解为什么我只是在文档就绪功能中调用该函数？

JS Bundle For Page：

块引用

＆＃13;

$(document).ready(function () {
    // This works fine and as expected my Selects are rendered perfect
    $('select').material_select();
    fetchSoftware();
    getusersinit();
});

var fetchSoftware = function fetchSoftware() {
    $.ajax({
        type: "Get",
        url: "Dashboard/GetSoftwares",
        data: { userName: "*****" },
        success: function success(softwares) {
            console.log(softwares);
            $("#softwareSelectDefault").remove();
            Object.keys(softwares).forEach(function (key) {
                $("#softwareSelect").append("<option>" + softwares[key] + "</option>");
            });
            //Down here shit falls apart. This doesen't work
            $('select').material_select();
        },
        error: function error(errorMessage) {
            //window.location.href = "/account/signin";
        }
    });
};

var getusersinit = function getusersinit() {
    $.ajax({
        type: "Get",
        url: "***********",
        data: { userName: "**********" },
        success: function success(reports) {
            console.log(reports);
            $(".progress").remove();
            Object.keys(reports).forEach(function (key) {
                $("#******").append("<tr id=\"" + reports[key].id + "\"><td><i class=\"medium material-icons\">" + reports[key].locked + "</i></td><td><i class=\"medium material-icons\">" + reports[key].status + "</i></td><td>" + reports[key].user + "</td><td>" + reports[key].script + "</td><td>" + reports[key].software + "</td><td>" + reports[key].testBench + "</td><td>" + reports[key].repository + "</td><td>" + reports[key].executionTime + "</td><td>" + reports[key].startDate + "</td></tr>");
            });
        },
        error: function error(errorMessage) {
            window.location.href = "/account/signin";
        }
    });
};

＆＃13;

更新10-04-2018
因此，在昨天花了几乎整个工作日来解决这个问题之后，我现在离解决方案更近一些了。我发现了一些很奇怪的东西显然，问题在于我的ajax调用。我有一个理论，它取决于网址或回复。

＆＃13;

$(document).ready(function () {
    //fetchSoftware works. If i run getuserinit it does not. Then material_select doesen't exist
    fetchSoftware();
});

var fetchSoftware = function fetchSoftware() {
    $.ajax({
        type: "Get",
        url: "https://jsonplaceholder.typicode.com/posts/1",
        data: { userName: "XXXXXX" },
        success: function (result) {
            $("#testReports").append(`<tr><td>TEST</td></tr>`);
            $("#softwareSelect").append(`<option>Test Option</option>`);
            $('#softwareSelect').material_select();
        },
        error: (errorMessage) => {
            window.location.href = "/account/signin";
        }
    });
};
var getusersinit = function getuserinit() {
    $.ajax({
        type: "Get",
        url: "Dashboard/LoadTable",
        data: { userName: "XXXXXX" },
        success: function (result) {
            $("#testReports").append(`<tr><td>TEST</td></tr>`);
            $("#softwareSelect").append(`<option>Test Option</option>`);
            $('#softwareSelect').material_select();
        },
        error: (errorMessage) => {
            window.location.href = "/account/signin";
        }
    });
};

＆＃13;

Answer 1

formSelect（）是新方法。

使用from selenium import webdriver from selenium.webdriver.firefox.options import Options print("Executing script") options = Options() #options.add_argument("--headless") options.set_headless(headless=True) try: driver = webdriver.Firefox(firefox_options=options, executable_path="/path-to-driver/geckodriver.exe"); driver.get("https://www.google.com") print(driver.page_source) finally: driver.quit() print ("Script executed successfully")代替material_select（）

Answer 2

我修复了这个问题，虽然这是一个解决方法。将选择放在变量...

＆＃13;

/*
These constant are created because of an unsolved issue:
See https://stackoverflow.com/questions/49728000/
By putting the selects into constants, and only referencing the constants,
this is a workaround.
*/
var selectSoftware = $('#softwareSelect');

$(document).ready(function () {
    selectSoftware.material_select();
    getSoftware();
});

var getSoftware = function getSoftware() {
    $.ajax({
        type: "Get",
        url: "Dashboard/GetSoftwares",
        data: { userName: "XXXXXXX" },
        success: function success(softwares) {
            console.log(softwares);
            $("#softwareSelectDefault").remove();
            Object.keys(softwares).forEach(function (key) {
                $("#softwareSelect").append("<option>" + softwares[key] + "</option>");
            });
            selectSoftware.material_select();
        },
        error: function error(errorMessage) {
            //window.location.href = "/account/signin";
        }
    });
};

＆＃13;

实现CSS选择更新错误

2 个答案: