1

如果选中复选框，如何在 Html 中制作可能折叠的字段。我正在用 Django 编程。

问候， 金塔雷

4

3 回答 3

2

触摸太空人...

我也推荐 jquery ( http://jquery.com/ )，因为它非常易于使用。

这是一些心跳加速的代码。

$("#my_checkbox").change( function() { 
   if ($(this).is(':checked')) {
      $("#my_html").hide(); // hide element with id="my_html"
   } else {
      $("#my_html").show(); // show...
   }
});
于 2011-01-31T08:57:22.983 回答
1

下面的 jQuery 代码使用一个“+”的图像，然后是一个标题。例如+前十名

我用它来制作手风琴。

$(document).ready(function () {
    $("div#hideable div").hide();
    // add css to show +/- symbols and labels - no point showing them if they don't work!
    $("div#hideable h3 a img").css("display", "inline");
    $("div#hideable label").css("display", "inline");

    $("div#hideable h3 a").toggle(function () {
        $($(this).attr("href")).show();
        imgName = $(this).find('img').attr("src").split("-", 1); //grab the image name so that we get the right one
        $(this).find('img').attr("src", imgName + "-minus.gif"); //change img, alt and label to match action
        $(this).find('img').attr("alt", "-");
        var sectionId = $(this).attr("href").substring($(this).attr("href").length - 1);
        if (sectionId == 0) {
            sectionId = 10;
        }
        labelName = "#lblSection" + sectionId;
        $(labelName).text("click '-' to collapse");
    }, function () {
        $($(this).attr("href")).hide();
        $(this).find('img').attr("src", imgName + "-plus.gif");
        $(this).find('img').attr("alt", "+");
        var sectionId = $(this).attr("href").substring($(this).attr("href").length - 1);
        if (sectionId == 0) {
            sectionId = 10;
        }
        labelName = "#lblSection" + sectionId;
        $(labelName).text("click '+' to expand");
    });
});
于 2011-01-31T08:56:39.577 回答
1

您需要一个 javascript 库，例如 jQuery - 然后很容易将动画动作分配给事件。阅读 jQuery 文档来学习，或者剪切和粘贴其他人很快就会放在这里的解决方案......

请注意，这不是特定于 Django 的问题，而是它的 javascript 和 html。

于 2011-01-31T08:45:43.573 回答