Untitled

// ==UserScript==

// @name           select2checkbox

// @match          http://*/*

// ==/UserScript==

(function(){

 

var CHECKBOX_TEMPLATE = '<label><input type="checkbox" name="%name" value="%value" /><span style="margin-left:5px;">%text</span></label></br>';

var div = document.createElement('div');

var select = document.querySelector('#components');

var name = select.name;

var options = Array.prototype.slice.apply(select.options);

 

// convert select to checkbox

var injectHTML = "";

for(var i=0;i<options.length;i++){

    var html = CHECKBOX_TEMPLATE;

    html = html.replace('%name', name);

    html = html.replace('%value', options[i].value);

    html = html.replace('%text', options[i].innerHTML);

    injectHTML += html;

}

div.innerHTML = injectHTML;

 

// create revert link

var revertLink = document.createElement('a');

revertLink.href = "javascript:void(null)";

revertLink.innerHTML = "元に戻す";

revertLink.addEventListener('click', function(){

    div.style.display = "none";

    revertLink.style.display = "none";

    select.style.display = "";

});

 

// select box hide

select.style.display = "none";

 

// insert

var injectElement = select.parentNode.insertBefore(div, select);

select.parentNode.insertBefore(revertLink, select);

 

})();