Question

我有一个复选框列表如下：

<s:checkboxlist list="books" name="checked" theme="simple" cssStyle="vertical"                      
listKey="code" listValue="description" >    </s:checkboxlist> 
<s:submit value="submit" name="submit"/>

我有复选框，如学术，小说，烹饪食谱等。即，有多个复选框，我可以从中选择多个选项。比如说，我选择小说和学术，然后应该展示小说和学术下的所有书籍。如果我只选择小说，那么只需要显示小说类别下的书籍。我想要一个提交按钮，点击该按钮会根据所选类别列出所有图书。

当我尝试使用复选框列表中的onchange功能时（第二个代码，如下所示），它不适用于多个选择，即，只要我检查一个复选框（例如，小说），页面就会自动刷新在我检查其他复选框之前，只显示该特定类别下的书籍（即小说）。因此，以下内容不允许我检查多个复选框。有没有其他方法可以达到这个目的？

<s:checkboxlist list="books" name="checked" theme="simple" cssStyle="vertical"                      
listKey="code" listValue="description" onchange="searchBook(this)" >    </s:checkboxlist> 


function searchBook(book){
var bookValue   = book.value;
document.getElementById("book").value = bookValue;     
document.forms[0].submit();
}

谢谢！

Answer 1

 <s:checkboxlist list="books" name="checked" theme="simple" cssStyle="vertical"  
listKey="code" listValue="description" onchange="searchBook(this)" >    </s:checkboxlist>

您可以使用onchange或onclick

var lastVal = ""; // globale variable
    function searchFunction(){
        var checkboxes = document.getElementsByName('checked');
        var vals = "";
        for (var i=0, n=checkboxes.length;i<n;i++) {
          if (checkboxes[i].checked) 
          {
          vals += ","+checkboxes[i].value;
          }
        }
        if (vals) vals = vals.substring(1);
        if(vals != "" && lastVal != vals){
            lastVal = vals;
            document.getElementById("book").value = vals;     
            document.forms[0].submit();
        }

    }

使用struts2中的s：checkboxlist选择多个复选框来显示结果

1 个答案: