Question

我在问卷中使用手风琴小部件（400个问题），其中每个小组代表问题和内容 - 响应区域。由于存在长排问题，因此用户希望对已回答的问题提供视觉帮助。这是通过改变手风琴面板的背景颜色来实现的。

（请参阅此处的示例 - 第4章http://jsfiddle.net/PatrickObrian/b3A7a/31/）

每个问题都有4个选项可供回答：是，否，NS和NA。对于“N”响应 - 手风琴面板应将背景颜色更改为“A”，否则应将其更改为“B”。如果没有给出响应=应保持默认值。现在，看起来简单，我试图使用内联css选项，但仍然无法使其工作））））

jQuery(function () {
  $('.Response').change(function () { 
   if (this.value == 'Y') { 
    $('.ui-accordion-header').css("background-color", "green"); 
   } else if (this.value == 'N') { 
    $('.ui-accordion-header').css("background-color", "red"); 
   } 
   }); 
});

所以我遇到的问题是：

1 - 它现在还不起作用;和

2 - 类“ui.accordion-header”适用于长行问题中的所有手风琴小组（abt 400）;因此，当选择“Y”时，它会改变问卷中所有手风琴小组的背景，而它应该仅改变用户提供回应的特定问题。

提前致谢！

Answer 1

这应该有效：

jQuery(function () {
    $('.Response input[type=radio]').change(function () {
        console.log(this.value)
        if (this.value == 'Y') {
            $(this).closest('.ui-accordion-content').prev().css("background", "green"); 
        } else if (this.value == 'N') {
            $(this).closest('.ui-accordion-content').prev().css("background", "red"); 
        } else {
            $(this).closest('.ui-accordion-content').prev().css("background", ""); 
        }
    });
});

工作小提琴：http://jsfiddle.net/sabof/R4sHj/

基于用户输入的Accordion面板定制

1 个答案: