0

使用 jquery，给定多个复选框，如果选中/取消选中特定复选框，我们可以打开/关闭字段集。此外，如果默认选中复选框，则在页面加载时将显示相应的字段集。请参阅http://jsfiddle.net/Hbmpk/1/ 但是，如果这是在 Typo3 中完成的，则在页面加载时不会显示字段集。

这是打字稿：

page.includeJSlibs.jquery.external = 1
page.includeJSlibs.jquery = http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js

 page.headerData.10 = TEXT
 page.headerData.10.value (
   <script type="text/JavaScript">
    #show fieldset on page load if checkbox checked  
    $(document).ready(function() {$('#showfruit').toggle($('#fruitid').prop('checked')); });

   #toggle fieldsets
   $(window).load(function(){
   $('#fruitid').change(function(e) {
     $('#showfruit').toggle(this.checked);
});
$('#vegid').change(function(e) {
    $('#showveg').toggle(this.checked);
});
});
   </script>
 )

这是html：

<form>
 Which food group do you like?
 <!-- Fruit is checked by default -->
 Fruit <input type="checkbox" name="nutrition[]" value="Fruit" id="fruitid" checked="checked">
 Veges <input type="checkbox" name="nutrition[]" value="Vegetables" id="vegid">

<!-- toggle fieldsets if checkbox is checked -->
<!-- display showfruit fieldset on page load -->
<fieldset id="showfruit" style="display:none;">
 You chose Fruit! Name one fruit: <input type="text" name= "afruit" />
</fieldset>
<fieldset id="showveg" style="display:none;" >
 You chose Veges! Name one veg: <input type="text" name= "aveg" />
 </fieldset>
 </form>

这是尝试将typo3-formhandler 验证与链接的复选框和输入一起使用的简化；切换最初工作正常，但是当提交、验证和返回表单时（例如，如果未回答强制性问题），则复选框仍处于选中状态，但现在不再显示显示的相应字段集。

ps，jquery 归功于 Jason P - jquery: toggle a fieldset based on a specific check checkbox in a array of multiple checkboxes

4

1 回答 1

0

TYPO3 扩展jquerycolorbox也很活跃。jquerycolorbox可能包含小于 1.6 的 jquery 版本，因此不支持.prop() 在 jquerycolorbox 之上包含更高版本的 jquery 没有帮助，并且本质上是不正确的做法。

停用jquerycolorbox和包括jquery 1.10.2/jquery.min.js工作正常。

鉴于所讨论的页面实际上使用了 TYPO3 表单处理程序验证，也许最好的解决方案是一些打字稿，它采用初始表单提交结果，然后在相关的地方定义整个字段集，比如###fruit_fieldset###......

于 2013-07-29T12:03:07.103 回答