Question

我有一堆来自A-Z的字母按钮，我还有4个其他按钮（“真”，“假”，“是”和“否”）

显示4个按钮的html代码（“True”，“False”，“Yes”和“No”）如下：

<td>
    <input class="answerBtns answers answerBtnsOff" name="answerTrueName"  id="answerTrue"  type="button"   value="True"    onclick="btnclick(this);"/>
    <input class="answerBtns answers answerBtnsOff" name="answerFalseName" id="answerFalse"     type="button"   value="False"   onclick="btnclick(this);"/>
    <input class="answerBtns answers answerBtnsOff" name="answerYesName"   id="answerYes"   type="button"   value="Yes"     onclick="btnclick(this);"/>
    <input class="answerBtns answers answerBtnsOff" name="answerNoName"    id="answerNo"        type="button"   value="No"      onclick="btnclick(this);"/>
    </td>

下面的代码控制着一个“添加行”按钮，当点击它时，它将关闭所有按钮，它应该只打开所需的按钮，具体取决于与答案匹配的按钮ID。

    function addwindow(btn) { 
        var answers = $.map(btn.split(''),function(chr){   return "#answer"+chr;  }).join(', ');
$('.answerBtns').removeClass('answerBtnsOff').removeClass('answerBtnsOn');
        $('.answerBtns').addClass('answerBtnsOff');
        $(answers).addClass("answerBtnsOn");
    }

问题是我点击“添加行”按钮并且答案是“真”，然后它应该关闭所有按钮并且只打开“真实”按钮（#answerTrue）。但是这个例子没有打开这个按钮。实际上它没有打开那4个按钮（“True”，“False”，“Yes”，“No”）。有没有人知道为什么这些4个按钮在点击“添加行”按钮后无法打开？

更新：

该应用程序的网址为here。请按照以下步骤使用该应用：

步骤1：当你打开应用程序时，你会看到一个绿色加号按钮页面，单击它，它将显示一个模态窗口。
步骤2：在模态窗口中有一个搜索栏，输入“AAA”和提交搜索，你会看到一堆行出现。
第3步：在第一行中，您会在“Answer”列下看到答案是B，点击此行内的“添加”按钮，模态窗口将关闭，你会看到答案按钮已经显示“B”按钮突出显示。

现在这个工作正常但它只适用于字母按钮：

步骤4：再次单击绿色加号按钮，此时执行搜索“true”;
第5步：这次你会看到“Answr”下出现一行专栏答案是“真实”。单击“添加”添加此行按钮
步骤6：您将看到它显示“True”和“False”按钮但即使答案是，“True”按钮也不会突出显示 “真”。

为什么不突出显示此按钮？

Answer 1

建议，而不是：

$('.answerBtns').addClass('answerBtnsOff');
$(answers).addClass("answerBtnsOn");

尝试：

$(answers).addClass("answerBtnsOn").siblings().addClass('answerBtnsOff');

但问题是answer不包含正确的按钮，而是选择#answerT。

你的问题在这里：

var answers = $.map(btn.split(''),function(chr){   return "#answer"+chr;  }).join(', ');

尝试进行一些调试，警报，并可能添加一些if。试试这段代码

if(btn=="True" || btn=="False" || btn=="Yes" || btn=="No"){
    var answers = '#answer'+btn;
} else {
    var answers = $.map(btn.split(''),function(chr){   return "#answer"+chr;  }).join(', ');
}

Answer 2

可能是因为您只是添加了answerBtnsOn-class，但没有删除answerBtnsOff-class。

尝试添加：

$(answers).removeClass("answerBtnsOff");

另外，我认为您可以使用类选择它们而不是地图：

$(".answerBtns").addClass("answerBtnsOn");
$(".answerBtns").removeClass("answerBtnsOff");

True，False，Yes和No按钮未被选中

2 个答案: