Question

我有一个复选框，然后点击我显示一个确认框。当＆＃34; OK＆＃34;在确认框中单击。没关系。我想阻止它在＆＃34; CANCEL＆＃34;单击确认框？每次我在确认框中点击取消时都会检查它？

代码位于以下

<input ng-model="checkboxValue" ng-click="makeLive(row)" type="checkbox">

$scope.makeLive = function (row)
{
    if ($window.confirm("Sure to make it live?Can't edit after making it live.") === true)
    {
        alert("id====" + row.entity.id);

    } else
    {
        return false;
    }
};

Answer 1

如果用户取消它。你可以使用preventDefault。像这样

＆＃13;

$(document).ready(function(){
$('#ifs').click(function(e){
e.preventDefault();
});
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input ng-model="checkboxValue" id="ifs" type="checkbox">

＆＃13;

Answer 2

由于我们发现此代码现在正在重复...

...您需要将ng-model更改为属于row对象的变量（无论是什么）。这样可以防止相互冲突的复选框点击相互冲突。

所以你的HTML现在变成了：

<input ng-model="row.isLive" ng-click="makeLive(row)" type="checkbox">

然后将row.isLive值分配给$window.confirm()函数的返回值：

$scope.makeLive = function(row) {

  row.isLive = $window.confirm(
    "Sure to make it live? Can't edit after making it live."
  );

  if (row.isLive){
    // do something (if you want to)
  else{
    // do something else (if you need to)
  }
};

<强>演示

CodePen: Using $window.confirm() to continue-to (or cancel-from) checking a checkbox

Answer 3

简单如下代码： - ）

<input ng-model="checkboxValue" ng-click="makeLive(row)" type="checkbox">


$scope.makeLive = function (row)
{
    if ($window.confirm("Sure to make it live?Can't edit after making it live.") === true)
    {
        alert("id====" + row.entity.id);

    } else
    {
        $scope.checkboxValue = false;
        return false;
    }
};

Answer 4

你可以尝试这个 -

// Place all the styles related to the products controller here.
// They will automatically be included in application.css.
// You can use Sass (SCSS) here: http://sass-lang.com/
// Custom bootstrap variables must be set or imported *before* bootstrap.
@import "bootstrap";
@import "font-awesome";

body {
  min-height: 75rem; /* Can be removed; just added for demo purposes */
}

.navbar {
  margin-bottom: 0;
}

.jumbotron {
  padding-top: 6rem;
  padding-bottom: 6rem;
  margin-bottom: 0;
  background-color: #fff;
}

.jumbotron p:last-child {
  margin-bottom: 0;
}

.jumbotron-heading {
  font-weight: 300;
}

.jumbotron .container {
  max-width: 40rem;
}

.album {
  min-height: 50rem; /* Can be removed; just added for demo purposes */
  padding-top: 3rem;
  padding-bottom: 3rem;
  background-color: #f7f7f7;
}

.card {
  float: left;
  width: 33.333%;
  padding: .75rem;
  margin-bottom: 2rem;
  border: 0;
}

.card > img {
  margin-bottom: .75rem;
}

.card-text {
  font-size: 85%;
}

footer {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

footer p {
  margin-bottom: .25rem;
}

/*
* Custom styles
*/

.social-links li a {
  font-size: 1.5em;
}

JS代码中的函数将是 -

  <input ng-model="checkboxValue[$index]" ng-click="makeLive(row, $index)" type="checkbox">

当在角度js中单击确认框取消时，防止复选框被检查？

4 个答案: