簡體   English   中英

onclick =“ confirm()”取消按鈕不起作用

[英]onclick=“confirm()” cancel button not working

我在該網格中具有grid,對於特定記錄,我保持活動/不活動狀態。 這是那種狀態的看法

在此處輸入圖片說明

當我單擊活動按鈕時,它將顯示此警報消息。

在此處輸入圖片說明

但是當我單擊取消按鈕時,我無法停止將要處於活動狀態的操作。

這是此活動/非活動按鈕的html代碼段

   @if (item.Status == true)
                       {
                           <button class="btn btn-xs active btn-primary" data-HEI_ID = "@item.HEI_ID" data-status = "true"  onclick="confirm_active()">Active</button>                       
                            <button class="btn btn-xs inactiveColor btn-default" data-HEI_ID = "@item.HEI_ID" data-status = "false"  onclick="confirm_inactive()">Inactive</button>

                       }

                       else
                       {
                           <button class="btn btn-xs btn-default" data-HEI_ID = "@item.HEI_ID" data-status = "true"  onclick="confirm_active()">Active</button>                       
                           <button class="btn btn-xs inactiveColor btn-primary active" data-HEI_ID = "@item.HEI_ID" data-status = "false"  onclick="confirm_inactive()">Inactive</button>

                           }

這是警報消息的腳本部分

<script type="text/javascript">
function confirm_active() {
    var retVal = confirm("Are you sure you want to change the status to Active?");
    if (retVal == true) {
        // do stuff
        return true;
    } else {
        return false;
    }
}

function confirm_inactive() {
    var retVal = confirm("Are you sure you want to change the status to Inactive?");
    if (retVal == true) {
       // do stuff
        return true;
    } else {
        return false;
    }
}

如何使可行的取消按鈕

您錯過了onclick處理程序中的return語句。 另外請注意,以分號結束函數調用是一種很好的做法

更改

 onclick="confirm_active()"

 onclick="return confirm_active();"

同樣適用於confirm_inactive()

如果您使用返回任何值的onclick函數,則必須在函數之前寫return此處為示例)

   @if (item.Status == true)
                       {
                           <button class="btn btn-xs active btn-primary" data-HEI_ID = "@item.HEI_ID" data-status = "true"  onclick="return confirm_active()">Active</button>                       
                            <button class="btn btn-xs inactiveColor btn-default" data-HEI_ID = "@item.HEI_ID" data-status = "false"  onclick="return confirm_inactive()">Inactive</button>

                       }

                       else
                       {
                           <button class="btn btn-xs btn-default" data-HEI_ID = "@item.HEI_ID" data-status = "true"  onclick="return confirm_active()">Active</button>                       
                           <button class="btn btn-xs inactiveColor btn-primary active" data-HEI_ID = "@item.HEI_ID" data-status = "false"  onclick="return confirm_inactive()">Inactive</button>

                           }

您也可以在您的html中寫直接確認

                           <button class="btn btn-xs btn-default" data-HEI_ID = "@item.HEI_ID" data-status = "true"  onclick='confirm("Are you sure you want to change the status to Inactive?")'>Active</button>                       

您需要將值返回給創建此事件的元素。 您在單擊該元素時調用一個函數,元素如何知道該函數的返回值。 因此,您需要在點擊時使用return confirm_inactive()來代替confirm_inactive()

使用confirm_inactive()就像

function onClick(){
   confirm_inactive()
}

返回confirm_inactive()就像

function onClick(){
   return confirm_inactive()
}

在第一種情況下,即使Confirm_inactive()返回某些內容,調用onClick()也會使您不確定。 但是在第二種情況下,當您調用onClick()時,它將調用Confirm_inactive()並返回其結果。

這個例子只是為了理解問題。

<!DOCTYPE html>
<html>
<head>
    <META HTTP-EQUIV="Content-Language" charset="UTF-8">
    <script type="text/javascript" src="jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="bootstrap.css">
    <style>

    </style>
</head>
<body>
    <table>
        <thead>
            <tr>
                <th>University ID</th>
                <th>University Name</th>
                <th>Established Year</th>
                <th>Type</th>
                <th>Status</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>000001</td>
                <td>Kelum U</td>
                <td>1976</td>
                <td class="privacy">Private</td>
                <td class="status">
                    <button class='btn btn-xs btn-default confirm_active' data-HEI_ID = '@item.HEI_ID' data-status = 'true'>Active</button><button class='btn btn-xs btn-danger active confirm_inactive' data-HEI_ID = '@item.HEI_ID' data-status = 'false'>Inactive</button>
                </td>
            </tr>
            <tr>
                <td>000002</td>
                <td>Wiling M</td>
                <td>1977</td>
                <td class="privacy">Public</td>
                <td class="status">
                    <button class='btn btn-xs btn-default confirm_active' data-HEI_ID = '@item.HEI_ID' data-status = 'true'>Active</button><button class='btn btn-xs btn-danger active confirm_inactive' data-HEI_ID = '@item.HEI_ID' data-status = 'false'>Inactive</button>
                </td>
            </tr>
        </tbody>
    </table>

    <script>
        $(".status .confirm_active").on('click', function(){
            var retVal = confirm("Are you sure you want to change the status to Active?");
            if(retVal == true){
                $(this).removeClass('btn-default').addClass('btn-primary active');
                $(this).closest('.status').find('.confirm_inactive')
                .removeClass('btn-danger active').addClass('btn-default');
                $(this).closest('tr').find('.privacy').html('Private');
            }
        });

        $(".status .confirm_inactive").on('click', function(){
            var retVal = confirm("Are you sure you want to change the status to Inactive?");
            if(retVal == true){
                $(this).removeClass('btn-default').addClass('btn-danger active');
                $(this).closest('.status').find('.confirm_active')
                .removeClass('btn-primary active').addClass('btn-default');
                $(this).closest('tr').find('.privacy').html('Public');
            }
        });
    </script>
</body>
</html>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM