Как отключить поведение меток в Chrome по умолчанию

Question

В Chrome

Я хочу использовать метку сведений <details>details</details>.

Но мне не нужно его поведение по умолчанию.

И как его отключить?

http://jsfiddle.net/x8csg/

Answer 1

В зависимости от того, что вы хотите сделать, я могу предложить следующее:

$('details').click(function(e){ e.preventDefault(); });

Вы должны предотвратить поведение по умолчанию. Как вы хотите заблокировать кнопки отправки формы ...

Обратите внимание, что в этом случае детали будут скрыты, поэтому вы должны изменить на:

<details open>details</details>

Answer 2

Только для справки, более полный ответ - это нужно настроить как на CSS, так и на Javascript:

Javascript:

var d=document.querySelectorAll('details:not(open)'), 
    i=d.length,
    f=function(e){e.preventDefault();};

while(i-- > 0) {

    // set the open attribute to the elements that doesn't have one 
    d[i].setAttribute('open',''); 

    // disable open/close behavior
    d[i].onclick = f;
}
// cleanup
delete(d);
delete(i);
delete(f);

Или стиль jQuery:

$('details:not(open)').attr('open',true).click(function(e){ e.preventDefault(); });

CSS:

/* disable <summary> marker/arrow on webkit */
summary::-webkit-details-marker { display: none;}

/* disable outline when clicked */
summary:focus{outline:none;}

Answer 3

summary::-webkit-details-marker {
    display: none;
}

http://jsfiddle.net/x8csg/1/