Contenteditable faceți clic oriunde în jurul elementului și este selectat în Chrome

În Chrome am un contenteditable = "adevărat" span simplu și dacă utilizatorul dă clic pe oriunde în jurul lui, cursorul apare și poate începe editarea. Acest lucru este enervant b/c Vreau doar să apară cursorul atunci când utilizatorul face clic pe spanul în sine, nu în afara acestuia.

Example: http://jsbin.com/oyamab/edit#javascript,html,live

Html de mai jos ...

<body>
  Hello World
</body>

Dacă vizitați acel link în Chrome, faceți clic oriunde în caseta html randată (coloana din partea dreaptă în jsbin) și puteți începe editarea. În Firefox, pe de altă parte, trebuie să faceți clic pe intervalul real pentru al edita (yay!).

Trebuie să accept acest lucru doar ca un lucru Chrome, sau există o hack în jurul acestuia? Mulțumiri.

0

1 răspunsuri

Cred foarte mult că este doar un lucru WebKit. Puteți lucra în jurul valorii de ea, deși făcând span contenteditable numai atunci când este făcut clic

Demo: http://jsfiddle.net/timdown/nV4gp/

HTML:

<body>
  Hello World
</body>

JS:

document.getElementById("hello").onclick = function(evt) {
    if (!this.isContentEditable) {
        this.contentEditable = "true";
        this.focus();
    }
};
0
adăugat
din păcate, dacă faceți clic în continuare pe extrema dreaptă a "salutului lumii", declanșează evenimentul onclick și îl face contenționabil. screenshot aici: i.imgur.com/WcTuZ.png
adăugat autor Ian Davis, sursa
@IanDavis: Nu inițial. Dacă vă asigurați că spanul nu este editat atunci când utilizatorul dă clic pe altundeva, este bine, deși puțin cam hacky:
adăugat autor Tim Down, sursa