Question

我有网格，在那个网格中，特别记录我保持活动/非活动状态。这是该状态的视图

enter image description here

当我点击活动按钮时显示此警告消息。

enter image description here

但是当我点击取消按钮时，我无法停止将进入活动状态的操作。

这是此活动/非活动按钮的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;
    }
}

如何制作可行的取消按钮

Answer 1

您错过了return处理程序中的onclick语句。另外需要注意的是使用分号结束函数调用的好习惯

更改

 onclick="confirm_active()"

到的

 onclick="return confirm_active();"

同样适用于confirm_inactive()。

Answer 2

如果使用返回任何值的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>

Answer 3

您需要将值返回给正在创建此事件的元素。您在单击该元素时调用函数，元素将如何知道该函数的返回值。因此，您需要使用confirm_inactive()而非return confirm_inactive()，而不是function onClick(){ confirm_inactive() }。

使用confirm_inactive（）就像

function onClick(){
   return confirm_inactive()
}

返回confirm_inactive（）就像

slider-item

在第一种情况下，即使confirm_inactive（）返回一些内容，当你调用onClick（）时，你将得到未定义的内容。但在第二种情况下，当您调用onClick（）时，它会调用confirm_inactive（）并返回其结果。

这个例子只是为了解问题。

Answer 4

<!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>

的onclick =＆＃34;确认（）＆＃34;取消按钮不起作用

4 个答案: