按钮单击功能不起作用,而另一个按钮则起作用

迈克尔·托特·科尔斯高(Michael Tot Korsgaard)

我正在和一些人一起工作Javascript而且我似乎无法在我的代码中调用click函数。

$('#btn_login').click功能可以正常工作,但$('#btn_logout').click不能正常工作。

cshtml文件如下所示:

<form action="" method="post">
    <span id="test"></span>
    <div id="logged_in" class="btn-group login loggedIn" style="display:none;">
    </div>

    <div id="logged_out" class="loggedOut">
        <span id="login-error"></span>
        <span id="login-loadingText"></span>
        <div class="form-inline login loggedOut">
            <input type="text" name="username" id="login-username" placeholder="Brugernavn/email" value="" class="form-control" />
            <input type="password" name="password" id="login-password" placeholder="Password" class="form-control" />
            <button type="button" id="btn_login" class="btn btn-default"><span class="glyphicon glyphicon-user"></span> Login</button>
            <button type="submit" name="btn" id="login-register" value="Registrer" class="btn btn-default" data-toggle="modal" data-target="#form_register"><span class="icon-user-add"></span> Ny bruger</button>
        </div>
    </div>
</form>

<script type="text/javascript">
var profileShownOnce = false;

$(document).ready(function () {
    $('#btn_logout').click(function () {
        logOut();
    });

    $('#btn_login').click(function () {
        var loadingId = "#login-loadingText";
        var span_error = $("#login-error");
        var username = $("#login-username").val();
        var password = $("#login-password").val();

        showLoadingText(loadingId);

        if (logIn(username, password)) {
            hideLoadingText(loadingId);
        } else {
            hideLoadingText(loadingId);
            span_error.html("Brugernavne eller password er forkert.");
        };
    });

    var $input = $('#login-username, #login-password'),
    $submit = $('#login-submit');

    function checkEmpty() {
        return $input.filter(function () {
            return !$.trim(this.value);
        }).length === 0;
    }

    $input.on('keyup blur', function () {
        $submit.prop("disabled", !checkEmpty());
    }).blur();

    toggleLogIn();
});
</script>

js文件如下所示:

function toggleVisible(loggedIn) {
var div1 = $(".loggedOut");
var div2 = $(".loggedIn");

if (loggedIn) {
    getProfile();
    div1.hide();
    div2.show();
} else {
    div1.show();
    div2.hide();
};
};

function toggleLogIn() {
$.getJSON("/User/GetJson_IsLoggedIn", null, function (data) {
    if (data) {
        getProfile();
        toggleVisible(true);
    } else {
        toggleVisible(false);
    };
});
};

function logOut() {
$.getJSON("/User/GetJson_Logout", null, function (data) {
    toggleVisible(false);
});
};

function logIn(username, password) {
$.getJSON("/User/GetJson_Login", {username: username, password: password}, function (data) {
    if (data) {
        toggleVisible(true);
        return true;
    } else {
        return false;
    };
});
};

function getProfile() {
var div = $("#logged_in");
$.getJSON("/User/GetJson_WhoIsLoggedIn", null, function (data) {
    printProfile(div, data);
});
};

function printProfile(div, item) {
if (!profileShownOnce) {
    profileShownOnce = true;
    var html = "<a href='#' class='dropdown-toggle no-shadow' data-toggle='dropdown'>" + item.profil.firstname + " " + item.profil.lastname + " <span class='caret'></span></a>" +
    "<ul class='dropdown-menu'>" +
    "<li>" +
    "<a href='~/Account/Profil?id=" + item.profil._id + "'>Profil</a>" +
    "</li>";

    if (item.rights.name == "Administrator") {
        html += "<li>" +
            "<div class='line-separator'></div>" +
            "</li>" +
            "<li>" +
            "<a href='~/Admin/User_List'>Bruger liste</a>" +
            "</li>";
    }

    html += "<li>" +
        "<button type='button' id='btn_logout' class='btn btn-default'><span class='glyphicon glyphicon-user'></span> Log ud</button>" +
        "</li>" +
        "</ul>";

    div.append(html);

    $('.dropdown-toggle').dropdown();
}
};
啤酒

如果在#btn_logout用户登录后将按钮动态添加到dom,则可以使用:

$(document).on('click', '#btn_logout', function(){
    logOut();
});

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

.replaceWith()在单击按钮后用另一个div替换div时不起作用

来自分类Dev

为什么一个功能起作用而另一个功能不起作用?

来自分类Dev

从另一个控制器广播功能不起作用,而仅在生产中起作用

来自分类Dev

另一个按钮内的按钮在Firefox(角度材料)中不起作用

来自分类Dev

HTML 按钮功能不起作用

来自分类Dev

2个功能不起作用,如果我单击按钮,它们会显示错误

来自分类Dev

将VBox和StackPane放入另一个StackPane后,按钮不起作用

来自分类Dev

阿贾克斯 | 使用警报();另一个文件中的功能不起作用

来自分类Dev

服务内部的 angular 2 构造函数在服务内部运行另一个功能不起作用

来自分类Dev

我的一个子类中的一个功能不起作用,即使另一个子类中的功能相同

来自分类Dev

在具有多个视图模型的选项卡中单击按钮,导航到另一个选项卡不起作用

来自分类Dev

单击不起作用的按钮

来自分类Dev

链接到按钮的原型功能不起作用

来自分类Dev

为什么按钮上的addTarget的功能不起作用?

来自分类Dev

通过单选按钮循环,功能不起作用

来自分类Dev

我的按钮和链接的悬停功能不起作用

来自分类Dev

贝宝按钮中的退货功能不起作用

来自分类Dev

简单的 HTML Javascript 按钮 onclick 功能不起作用

来自分类Dev

输入类型按钮 onclick 功能不起作用

来自分类Dev

向我的库对象添加另一个条目后,删除按钮不起作用

来自分类Dev

jQuery单选按钮单击和更改功能不起作用

来自分类Dev

HTML全部按钮不起作用,只有一个按钮起作用

来自分类Dev

.on()jQuery单击功能不起作用?

来自分类Dev

单击功能不起作用

来自分类Dev

addEventListener单击功能不起作用

来自分类Dev

jQuery单击功能不起作用

来自分类Dev

单击下一个滑块按钮后自动滑动不起作用

来自分类Dev

jQuery的下一个按钮不起作用

来自分类Dev

上一个按钮不起作用

Related 相关文章

  1. 1

    .replaceWith()在单击按钮后用另一个div替换div时不起作用

  2. 2

    为什么一个功能起作用而另一个功能不起作用?

  3. 3

    从另一个控制器广播功能不起作用,而仅在生产中起作用

  4. 4

    另一个按钮内的按钮在Firefox(角度材料)中不起作用

  5. 5

    HTML 按钮功能不起作用

  6. 6

    2个功能不起作用,如果我单击按钮,它们会显示错误

  7. 7

    将VBox和StackPane放入另一个StackPane后,按钮不起作用

  8. 8

    阿贾克斯 | 使用警报();另一个文件中的功能不起作用

  9. 9

    服务内部的 angular 2 构造函数在服务内部运行另一个功能不起作用

  10. 10

    我的一个子类中的一个功能不起作用,即使另一个子类中的功能相同

  11. 11

    在具有多个视图模型的选项卡中单击按钮,导航到另一个选项卡不起作用

  12. 12

    单击不起作用的按钮

  13. 13

    链接到按钮的原型功能不起作用

  14. 14

    为什么按钮上的addTarget的功能不起作用?

  15. 15

    通过单选按钮循环,功能不起作用

  16. 16

    我的按钮和链接的悬停功能不起作用

  17. 17

    贝宝按钮中的退货功能不起作用

  18. 18

    简单的 HTML Javascript 按钮 onclick 功能不起作用

  19. 19

    输入类型按钮 onclick 功能不起作用

  20. 20

    向我的库对象添加另一个条目后,删除按钮不起作用

  21. 21

    jQuery单选按钮单击和更改功能不起作用

  22. 22

    HTML全部按钮不起作用,只有一个按钮起作用

  23. 23

    .on()jQuery单击功能不起作用?

  24. 24

    单击功能不起作用

  25. 25

    addEventListener单击功能不起作用

  26. 26

    jQuery单击功能不起作用

  27. 27

    单击下一个滑块按钮后自动滑动不起作用

  28. 28

    jQuery的下一个按钮不起作用

  29. 29

    上一个按钮不起作用

热门标签

归档