2014-04-03 3 views
0

Итак, моя проблема в том, что у меня есть таблица, содержащая 5 элементов. Один из элементов - это флажок, а другой - привязка. Когда я нажимаю на якорь, он подавляет действие по умолчанию и добавляет класс к якорю. У меня есть атрибут «имя-данные», равный имени поля. Мне нужно выполнить следующее.JQuery Установите флажок, если элемент имеет класс

Когда я нажимаю на якорь с атрибутом данных, мне нужно установить флажок с тем же именем, которое нужно проверить.

Мой код ниже.

<script> 
$(document).ready(function(){ 
var clicks= 0; 
var DELAY=700; 

$("a").on("click", function(e){ 
    e.preventDefault(); 
    if($(e.target).hasClass("selected")){ 
     $(e.target).removeClass("selected"); 
    } else { 
     $(e.target).addClass("selected"); 
    } 
    clicks++; //count clicks 
if($(e.target).hasClass("selected")){ 
      var data_name = $(e.target).data('name'); 
    if($("input[name="+data_name+']').attr('name') === data_name) 
     $('input[name='+data_name+']').find('input[name='+data_name+']').prop('checked', true); 

} 
    if(clicks === 1) { 
     timer = setTimeout(function() { 
     clicks = 0; //after action performed, reset counter 

    }, DELAY); 
    } else { 
     clearTimeout(timer); //prevent single-click action 
    window.location = $(event.target).attr("href"); 
     clicks = 0; //after action performed, reset counter 
    } 
}); 
$("a").on("dblclick", function(e){ 
    e.preventDefault(); //cancel system double-click event 
}); 
}); 
</script> 

Таблица выглядит как прикрепленное изображение (оно выглядит лучше, чем доступный код). enter image description here

строка Пример таблицы следующая

<?php 
    // $files is the number of files in each directory. 
    for($i=0; $i<$files;$i++){ 
?> 
<tr> 
    <td> 
     <input type="checkbox" name="todelete<?= $i?>" value="404.shtml"> 
    </td> 
    <td> 
     <i class="fa fa-file-text-o center"></i> 
    </td> 
    <td> 
     <a href="http://kregelbagel.com/404.shtml" value="" data-name="todelete">404.shtml</a> 
    </td> 
    <td>437</td> 
    <td> bytes</td> 
</tr> 
<?php 
    } 
?> 
+0

Я предполагаю, что JavaScript необходим для страницы .... какова цель якоря, если вы предотвращаете дефолт? Не могли бы вы просто сменить это ярлык? Что-то вроде: http://jsfiddle.net/KMkjc/ (Или, если вы планируете отступить, не могли бы вы обновить якорь до значка, чтобы символизировать ссылку, а затем использовать метку?) – Jack

ответ

1

Вместо того, чтобы data значение, вы можете получить input элемент первого собрата родителя td вашего щелкнули якоря и установите проверенное состояние на истинный:

$("a").on("click", function(e){ 
    e.preventDefault(); 
    $(this).toggleClass('selected'); 
    clicks++; //count clicks 
    if($(this).hasClass("selected")){  
     $(this).parent().siblings('td:first').find('input').prop('checked', true); 
    } 
    // Rest of your code here 
}); 

Вы также можете сократить свой код, используя .toggleClass() вместо if и else заявление.

+0

Я закончил с этим решением , Он работал безупречно. И вы сделали свое программирование более эффективным, указав '.toggleClass()'. Серьезно вы просто избавились от наполовину моего скрипта! : D Большое спасибо! –

1

Есть еще несколько битов, которые я не получил, но попробовать

$("a").on("click", function (e) { 
    e.preventDefault(); 

    //use toggleClass to switch the class 
    $(this).toggleClass("selected"); 

    clicks++; //count clicks 
    if ($(this).hasClass("selected")) { 
     //just use attribute equals selector to get the checkbox 
     $('input[name=' + $(this).data('name') + ']').prop('checked', true); 
    } 
    if (clicks === 1) { 
     timer = setTimeout(function() { 
      clicks = 0; //after action performed, reset counter 
     }, DELAY); 
    } else { 
     clearTimeout(timer); //prevent single-click action 
     window.location = $(event.target).attr("href"); 
     clicks = 0; //after action performed, reset counter 
    } 
}); 
  • вы можете использовать .toggleClass() для переключения представляет класс
  • , чтобы найти элемент ввода с заданным именем, используйте attribute equals selector

Отказ от ответственности: Не проверял, или смотрел на то, почему щелчок или остальная часть кода используется

Смежные вопросы