web-dev-qa-db-fra.com

Désactiver la sélection de texte dans PhoneGap

Est-il possible de désactiver la sélection de texte pour rendre une application PhoneGap plus similaire à une application native normale?

Quelque chose comme ça:

document.onselectstart = function() {return false;}

ou:

* { 
user-select: none;
-moz-user-select: -moz-none;
-khtml-user-select: none;
-webkit-user-select: none;
}

Ou bien d'autres choses ne fonctionnent pas.

32
stmn

J'ai cherché partout de l'aide à ce sujet. Cela a finalement fonctionné pour moi.

public class MainActivity extends DroidGap {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        super.loadUrl("file:///Android_asset/www/index.html");

        super.appView.setOnLongClickListener(new View.OnLongClickListener() {

            public boolean onLongClick(View v) {
                return true;
            }
        });
    }
}

Le setOnClickListener est ce qui fait la magie. Assurez-vous de mettre cela APRÈS votre appel à super.loadUrl.

Bien sûr, cela désactivera la sélection de texte pour l'ensemble de votre application, mais je suis d'accord avec cela, et je n'ai pas d'autre moyen de le contourner pour l'instant.

Je ne suis pas encore sûr des implications complètes de cela, mais j'utilise l'événement "taphold" de JqueryMobile, et cela fonctionne toujours très bien. Je crois que cela fonctionne en gérant le long clic sur l'appView (qui héberge votre application HTML) et en l'empêchant de bouillonner.

32
habermanm

Le mettre sur html, pas *, travaille pour moi:

html {
    -webkit-user-select: none;
}
56
ThinkingStiff

En plus de ce que ThinkingStiff a mentionné, j'utilise également les éléments suivants pour supprimer toute mise en surbrillance/copier-coller

-webkit-touch-callout: none;
-webkit-tap-highlight-color: rgba(0,0,0,0); 
8
mattdryden

cela fonctionnera aussi.

<body oncontextmenu="return false" ondragstart="return false" 
onselectstart="return false">
8
nargil

Ajoutez ceci et appréciez. Fonctionne également sur iOS.

<style type="text/css">
*:not(input,textarea) {
    -webkit-touch-callout: none;
    -webkit-user-select: none; /* Disable selection/Copy of UIWebView */
}
</style>
4
atulkhatri

J'ai utilisé le code ci-dessous et son bon fonctionnement sur Android et les appareils iOS ainsi que sur l'émulateur/simulateur:

 * {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    }

   input, textarea {
    -webkit-user-select: auto !important;
    -khtml-user-select: auto !important;
    -moz-user-select: auto !important;
    -ms-user-select: auto !important;
    user-select: auto !important;
    }
1
VicJordan

Récemment mis à jour vers Android 4.4 KitKat et il a résolu le problème d'Edittext apparaissant sur taphold (appui long). Apparemment edittext n'apparaît pas sur taphold avec jquery mobile et phonegap sur Android 4.4. J'utilise une rom aosp personnalisée, donc je n'ai pas testé sur une version officielle, mais je suppose (et j'espère) que cela devrait fonctionner aussi pour toute version 4.4. Il semble également avoir résolu d'autres conflits que j'avais. avec onclick que j'ai posté ci-dessous.

Ancienne méthode que j'ai trouvée qui fonctionne (avec des problèmes possibles) pour les anciennes ICS roms (testé uniquement sur la rom personnalisée 4.0.4).
En ajoutant une barre de défilement

exemple:

<div id="scroll">content</div> 

<style>
#scroll {

height: 100%;
width: 100%;
}
</style>

Il empêche également le EditText d'appuyer sur la prise (appui long) pour phonegap et jquery mobile. Je ne sais pas encore si cela causera des conflits (comme cela semble avoir des effets avec onclick qui cherche à trier) mais avec du texte normal devrait bien fonctionner .--- Problèmes triés avec Android 4.4 et plus besoin de faire défiler non plus (voir en haut de l'article)

0
watson7d

Pour moi, c'était le meilleur:

-webkit-tap-highlight-color: rgba(0,0,0,0); 
tap-highlight-color: rgba(0,0,0,0);

Mon cas est arrivé avec pixi.js, avec

plugins.interaction.autoPreventDefault = true;
0
csomakk