Jquery通过链接检查并取消选中复选框

2018-06-25 08:50:54

我试图动态检查并取消选中与jquery框。

理想的情况是，如果编辑项目文件被点击，这将显示上传新图像的域(edit_project_image)是活动的，即不是通过再次点击(edit_project_image)或点击(remove_edit_image)被删除。此外，如果有一个strikethough，这将使我类remove_project_image将被添加，然后复选框也将被检查。

这个想法是，如果上述任何一个都是真的，那么当前活动图像需要被移除。

这里是我的jquery现在：

//show hide the file box to edit images
$('.edit_project_file').live('click',function() {
    $(this).parent().next().toggle();
    $(this).parent().removeClass("remove_project_image");
    return false;
});

//allow the user to remove the file box if they don't wish to edit an image
$('.remove_edit_image').live('click',function() {
   $(this).parent().hide();
   $(this).parent().removeClass("remove_project_image");
    return false;
});

//add strikethough when the user decides to delete an image
$('.remove_project_file').live('click',function() {
   $(this).parent().toggleClass("remove_project_image");
   $(this).parent().next().hide();
   return false;
});

这是Html标记：

<ul class="imgPreview">
    <li>
        <a href="#" rel="../images/portfolio/project_images/manager_pimg3_7_1281126121.jpg">manager_pimg3_7_1281126121.jpg </a>
        <a href="#" class="edit_project_file"> <img src="images/edit.gif"/></a>  
        <a href="#" class="remove_project_file"> <img src="images/delete.gif"/></a>  
    </li>   
    <li class="edit_project_image">
        <input name="upload_project_images[]" type="file" />  
        <a href="#" class="remove_edit_image" border="0"> <img src="images/delete.gif" /></a>
    </li>  
    <li>
        <input name="edit_image[]" type="checkbox" value="manager_pimg3_7_1281126121.jpg" class="edit_image_checkbox"/>
    </li>  
</ul>

我相信最好的情况会设置一个变量，如果为true，则将复选框的值设置为true。
我尝试过的东西包括：

    $('.remove_project_file').live('click',function() {
   $(this).parent().toggleClass("remove_project_image");
   $(this).parent().next().hide();
   if ($(this).parent().next(".edit_image_checkbox").is(":not(:checked)")){
    $('.edit_image_checkbox').attr('checked',true);
    }

    return false;
});

这种方式的工作原理是，它检查所有（上面是在php循环中）带有.edit_image_checkbox类的复选框，而不仅仅是被单击的remove_project_file类的旁边的remove_project_file 。也没有取消勾选链接时再次检查这个我试过else {$('.edit_image_checkbox').attr('checked',true);}这只是混淆它，因为它说如果它没有检查，然后检查它，但那么如果它被选中取消选中它。

我的另一个想法是使用一个变量，并将其设置为true或false，如果为true，则检查该框。我试过这样的：

    var file_checkbox_checked = false;
if(file_checkbox_checked ==  true){
$('.edit_image_checkbox').attr('checked',true);
}
else{
$('.edit_image_checkbox').attr('checked',false);
}

然后添加file_checkbox_checked = true; 到每个应该检查复选框的功能。这似乎什么都不做。我可以设置var file_checkbox_checked = true; 这将检查所有复选框与此另一个问题是没有办法取消选中它。

我仍然处于项目这部分的学习，头脑风暴的一部分，所以如果你有任何想法，他们会很棒。

我正确理解你的需求[当程序员不是:)]，当用户点击编辑或删除图像，你添加或删除remove_project_image类到li包含编辑/删除链接。现在，如果将类remove_project_image添加到li您想检查复选框，否则清除它。下面的代码片段可以做到这一点。

$('.remove_project_file').live('click',function() {
    $(this).parent().toggleClass("remove_project_image");
    //TO KNOW IF STRIKE-THROUGH IS APPLIED TO IT OR NOT
    var r = $(this).parent().hasClass("remove_project_image");
    $(this).parent().next().hide();

    //WE NEED TO GET THE LI CONTAINING CHECK BOX, ONE NEXT TO HIDDEN ONE
    var t = $(this).parent().next().next();
    //GET CHECKBOX
    var c=$(".edit_image_checkbox", t);
    $(c).attr('checked',r);
    return false;
});

链接地址: http://www.djcxy.com/p/71021.html

上一篇: Jquery check and uncheck checkbox with a link

下一篇: How to build a GUI application with Python 3.3 and Qt 5?