Question

重建网站，我希望在表单中给出几个单词“on”和“off”状态

之前的开发人员创建了这个网站，但看着他的代码却有些可怕 - http://www.mediwales.com/news。我正在灰色框中做位，可以选择扇区。

我该如何重新创建？在jquery中有更现代的方法吗？我需要它在所有浏览器中工作（直到IE7）。

我希望能够设置打开/关闭状态的样式并将其绑定到表单。

Answer 1

有很多资源可以帮助您，但是既然您提到了jQuery，以下资源可以帮助您：http://tutorialzine.com/2011/03/better-check-boxes-jquery-css/

Answer 2

我找到了一个自定义多项选择，其复选框最易用，如本网站上的内容：http://www.pracuj.pl/（点击Region或Kategoria）

Answer 3

你可以尝试使用像wijmo这样的库（查看http://wijmo.com/demo/explore/#formdecorator|overview;你只需要在它周围画一个矩形并改变样式）。或者像快速而肮脏的解决方案那样做：

CSS：

.check { display: block; border: 1px solid #000; }
.check.selected { border: 2px solid red; }

HTML：

<div class="check" id="biotech-id">Biotechnology</div>
<div class="check" id="financial-id">financial</div>

jQuery的：

$('.check').on('click', function(e) {
    el = $(e.currentTarget);
    el.toggleClass('selected');
    if(el.hasClass('selected')) {
        input = $('<input type="hidden" name="checkedSectors[]" value="'+ el.attr('id') + '" id="hiddeninput-'+ el.attr('id') +'" />');
        el.after(input);
    } else {
        $('#hiddeninput-'+ el.attr('id')).remove();
    }
});

表单中包含单词的开/关状态？

3 个答案: