2010-06-20 13 views
5

Come ben sai, facendo doppio clic su una parola in un browser lo seleziona, il triplo clic seleziona l'intero paragrafo.Domanda di usabilità HTML - (doppio) facendo clic per selezionare il testo

sto tweaking un wiki, in cui le firme per gli utenti anonimi vengono creati automaticamente e apparire come:

--- // <ip.ad.dr.ess> //

Il " --- "genera un —, // è per il testo in corsivo e genera em > </em >.

Ecco come funziona ora, come l'ho ottimizzato. Ora mi sto chiedendo l'usabilità.

La mia domanda è: come generare il markup in modo tale che con un doppio clic sull'indirizzo IP, l'intero indirizzo e solo l'indirizzo sarà selezionato?

Il linguaggio di markup non importa, è possibile fornire una soluzione in HTML, ma è preferibile uno specifico per wiki (dokuwiki).

Grazie

+0

Questo è certamente risolvibile, ma è probabile che la soluzione sia complicata. A cosa serve? Non sarebbe forse più facile cambiare il Wiki in modo che non aggiunga automaticamente il contenuto? –

+0

Io sono colui che lo aggiusta per aggiungere quel contenuto. Funziona, ma ora mi chiedo dell'accessibilità – Flavius

+0

A cosa serve? Cosa intendi per accessibilità? –

risposta

5

Grazie a tutti, ma sono riuscito a farlo utilizzando un campo di testo di sola lettura impostato senza bordi e con il colore di sfondo dello sfondo del sito web.

Il doppio clic funziona come previsto, senza fare affidamento sullo script sul lato client.

2

Non si può farlo con HTML. Forse con Javascript. Fondamentalmente, si rileva solo il doppio clic in una determinata area e quindi selezionare il testo appropriato.

EDIT:

Ecco come farlo in browser compatibile W3C (ad esempio Firefox, probabilmente non funziona in IE, che non è un browser compatibile W3C e utilizza diverso modello di selezione del testo):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html> 
    <head> 
     <script type="text/javascript"> 
      function select(elem) { 
       var sel = window.getSelection(); 
       var range = sel.getRangeAt(0); 
       range.selectNode(elem); 
       sel.addRange(range); 
      }    
     </script> 
    </head> 
    <body> 
     <p>a simple paragraph, this is 
      <span onclick="select(this);">clickable area</span> 
      when this 
      <span ondblclick="select(this);">span tag is double-clicked</span> 
      then they will be selected 
     </p> 
    </body> 
</html> 
+0

In chrome, quello che ottengo come primo parametro della funzione è l'evento, quindi ho sostituito il parametro con 'e' e' elem' con 'e.target' e ha funzionato magnificamente. – haridsv

+0

Come per la documentazione 'Event', il primo parametro è in effetti l'oggetto evento stesso, non l'elemento. Vedi https://developer.mozilla.org/en/docs/Web/API/Event. Modifica: ho appena notato che stai passando 'questo' come primo parametro. – haridsv

+0

@haridsv: corretto se si collega il gestore eventi con addEventListener(). Quando l'evento è collegato in linea con l'attributo @onclick come qui, i parametri sono determinati da qualsiasi cosa tu abbia passato al gestore, che in questo caso è 'this', che è l'elemento. Al giorno d'oggi, è probabilmente una pratica migliore allegare in modo discreto con addEventListener() o con jquery piuttosto che collegarsi all'attributo onclick. –