我的标题可能无法真正表达我想要实现的目标，下面是代码
<div class="modal fade" id="confirm-delete" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="myModalLabel">Confirm Delete</h4>
</div>
<div class="modal-body">
<p>You are about to delete an item.</p>
<p>Do you want to proceed?</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-danger btn-ok">Delete</button>
</div>
</div>
</div>
</div>
<div class='col-md-1 cart_action pull_right' title='delete item'>
<i data-toggle='modal' data-target='#confirm-delete' class='glyphicon
glyphicon-trash deletecart' data-id=".$carts[$key]['id']." data-
itemNo=".$carts[$key]['item_number'].">
</i>
</div>
function deletecart(id,item_no){
var url = '{$url}'+'?itemNumber='+item_no+'&mode=remove&status=';
$.ajax({
url: '{$deletecartUrl}',
type: 'POST',
data: {id: id},
success: function (data) {
if(data === 'success'){
window.location= url+data;
}else{
window.location= url+data;
}
},
error: function(jqXHR, errMsg) {
// handle error
console.log(errMsg);
}
});
}
$('#confirm-delete').on('click','.btn-ok', '.deletecart', function(e) {
var modalDiv = $(e.delegateTarget);
id = $(this).attr('data-id');
item_no = $(this).attr('data-itemNo');
console.log(id);
console.log(item_no); return;
//deletecart(id,item_no);
modalDiv.addClass('loading');
setTimeout(function() {
modalDiv.modal('hide').removeClass('loading');
}, 1000)
});
点击模态中的ok按钮我想获取data-id和data-itemNo的值，这样我就可以通过ajax发送，我能够在不使用BS模式的情况下使用下面的代码< / p>
$(".deletecart").click(function(){
id = $(this).attr('data-id');
item_no = $(this).attr('data-itemNo');
deletecart(id,item_no);
});
但我认为使用模式会让它变得更酷，我尝试获取'#confirm-delete'的索引并使用它来获取".deletecart"的值，但索引总是-1，请任何人都可以帮忙解决这个问题，非常感谢
我编辑了我的问题并在下面发布了我的代码
<?php
//print_r($carts);exit;
if(isset($carts) && !empty($carts)){
foreach ($carts as $key => $cart){
$myurl = Yii::$app->UrlManager->createUrl(['/item','Id'=>$carts[$key]['slug'].'/'.$carts[$key]['product_id'],'itmNo'=>$carts[$key]['item_number']]);
echo "<div class='col-md-12 invisible-divider-20'></div>";
echo "<div class='col-md-12'>";
echo "<div class='tb_logo_cart pull_left'><img src=".$img."Logo_4_png.png alt=logo></div>";
echo "<div class='small-text-12 pull_left store_name_link'>Store: <a href=>".$carts[$key]['store_name']."</a></div>";
echo "</div>";
echo "<div class='col-md-12 cart_body'>";
echo "<div class='checkbox'>"
. "<label class='check_container pull_left'>"
. "<input type='checkbox'class='cart-checkbox' data-class='cart-ck-5'>"
. "<span class='checkmark'></span>"
. "</label>"
. "</div>";
echo "<div class='row nopadding'>";
echo "<div class='cart_item_img col-md-3 nopadding'><a href=".$myurl." class='nopadding'><img src=".$profileimg.$carts[$key]['profile_img']. "></a></div>";
echo "<div class='col-md-4 cart_title'>";
echo "<a href=".$myurl.">".$carts[$key]['title']."</a>";
echo "<div class='cart-condition text-muted'>Condition: ";
if($carts[$key]['product_condition'] == 0){
echo 'Not specified'; //if no item condition for this product show not specified
}elseif($carts[$key]['product_condition'] == 1){
echo "New with tags";
}elseif($carts[$key]['product_condition'] == 2){
echo "New without tags";
}elseif($carts[$key]['product_condition'] == 3){
echo "New with defects";
}else{
echo "Used";
}
echo "</div>";
echo "<div class='cart-sizes text-muted'>Size:".$carts[$key]['size']."</div>";
echo "<div class='cart-color text-muted'>Color:".$carts[$key]['color']."</div>";
echo "</div>";
$total_price = round(($carts[$key]['quantity']*$carts[$key]['price']),2);
echo "<div class='col-md-1 cart_action pull_right' title='delete item'><i data-toggle='modal' data-target='#confirm-delete' class='glyphicon glyphicon-trash'></i></div>";
echo "<div class='col-md-2 cart_total_price pull_right'>";
echo "N:<span>".$total_price."</span>";
echo "<div class='cart-shipping'>Shipping: <b>FREE</b></div>";
echo "</div>";
echo "<div class='col-md-1 cart_qtty pull_right nopadding'>";
echo "<span class='cart-qtt-control'>";
echo "<i class='glyphicon glyphicon-minus text-muted left-ctr' data-id=".$carts[$key]['id']." data-price=".$carts[$key]['price']."></i>";
echo "<input type='text' value=".$carts[$key]['quantity'].">";
echo "<i class='glyphicon glyphicon-plus text-muted right-ctr' data-id=".$carts[$key]['id']." data-price=".$carts[$key]['price']."></i>";
echo "</span>";
echo "</div>";
echo "<div class='col-md-1 cart_unit_price pull_right'>N:<span>".$carts[$key]['price']."</span></div>";
echo "</div>";
echo "</div>";
echo "<div class='modal fade' id='confirm-delete' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'>"
. "<div class='modal-dialog'>"
. "<div class='modal-content'>"
. "<div class='modal-header'>"
. " <button type='button' class='close' data-dismiss='modal' aria-hidden='true'>×</button>"
. " <h4 class='modal-title' id='myModalLabel'>Confirm Delete</h4>"
. "</div>"
. "<div class='modal-body'>"
. " <p>You are about to delete an item.</p>"
. "<p>Do you want to proceed?</p>"
. "</div>"
. "<div class='modal-footer'>"
. "<button type='button' class='btn btn-default' data-dismiss='modal'>Cancel</button>"
. "<button type='button' class='btn btn-danger btn-ok' data-id=".$carts[$key]['id']." data-itemNo=".$carts[$key]['item_number'].">Delete</button>"
. "</div>"
. "</div>"
. "</div>"
. "</div>";
}
}
＆GT;
function deletecart(id,item_no){
var url = '{$url}'+'?itemNumber='+item_no+'&mode=remove&status=';
$.ajax({
url: '{$deletecartUrl}',
type: 'POST',
data: {id: id},
success: function (data) {
if(data === 'success'){
window.location= url+data;
}else{
window.location= url+data;
}
},
error: function(jqXHR, errMsg) {
// handle error
console.log(errMsg);
}
});
}
$('#confirm-delete').on('click','.btn-ok', '.deletecart', function(e) {
var modalDiv = $(e.delegateTarget);
id = $(this).attr('data-id');
item_no = $(this).attr('data-itemNo');
console.log(id);
console.log(item_no); return;
//deletecart(id,item_no);
modalDiv.addClass('loading');
setTimeout(function() {
modalDiv.modal('hide').removeClass('loading');
}, 1000)
});
答案 0 :(得分：0)
在这些情况下我通常做的是将数据值注入模态html：
<button type="button" class="btn btn-danger btn-ok" data-id="..." data-itemNo="...">Delete</button>
甚至：
<div class="modal fade" id="confirm-delete" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-id="..." data-itemNo="...">
然后获取值是onclick是微不足道的。 Imo最好的方法是使用像Nunjucks这样的js模板系统。当单击初始删除按钮时，通过Nunjucks动态生成模态html（而不是在页面上对模式html进行编码）。另一种选择是使用jquery / js来注入数据值。