我在2次点击后禁用下载链接时遇到问题。禁用功能正常,但出现如下所述的问题
它的任何一种情况。我将我的代码放在下面。
var preventClick = false;
var howMany = 1;
$('.ThisLink').click(function(e) {
howMany += 1;
if (howMany == 3) {
$(this)
.css('cursor', 'default')
.css('text-decoration', 'none')
}
/*if (!preventClick) {
$(this).html($(this).html() + ' lalala');
}
preventClick = true;*/
return false;
});

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<table id="datatable" class="table table-striped table-bordered">
<thead>
<tr>
<th>#</th>
<th>Report</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<?php
$x = 1;
foreach ($h->result() as $row)
{ $ids = explode(',',$row->report);
$temp = sizeof($ids);
for($i =0; $i < $temp ; $i++)
{ ?>
<tr>
<td>
<?php echo $x++;?>
</td>
<td>
<?php echo $ids[$i];?>
</td>
<td>
<!-- <?php echo base_url()?>uploadFiles/<?php echo $ids[$i]; ?> -->
<a href="<?php echo base_url()?>uploadFiles/<?php echo $ids[$i]; ?>?>" target="_blank" class="btn btn-info ThisLink" download>Download</a>
<!-- <button id="my_button">Click Here</button> -->
</td>
<?php } ?>
</tr>
<?php }
?>
</tbody>
</table>
&#13;
答案 0 :(得分:2)
您如何看待这个:
CSS:
<style type="text/css">
.disabled{
background-color: gray;
pointer-events: none;
}
</style>
HTML:
<a href="downloadLocation.ext" id="autoIncrementWithPhp" class="yourClassLink">Link</a>
JS:
<script type="text/javascript">
//Create empty array
var arrayRememberClick=[];
//Add all link id to this array and initialise counter to 0
$('.yourClassLink').each(function(){
var idCurrent = $(this).attr('id');
arrayRememberClick[idCurrent]=0;
});
//Detect click
$('.yourClassLink').click(function(event){
var idClicked = $(this).attr('id');
arrayRememberClick[idClicked] += 1;
if(arrayRememberClick[idClicked]>=2){
$('#'+idClicked).addClass('disabled');
}
});