Javascript 如何在WebView[React Native]中禁用用户文本选择_Javascript_Ios_Webview_React Native_Textselection

Javascript 如何在WebView[React Native]中禁用用户文本选择

javascript ios webview react-native

Javascript 如何在WebView[React Native]中禁用用户文本选择,javascript,ios,webview,react-native,textselection,Javascript,Ios,Webview,React Native,Textselection,我正在尝试找出如何在ios应用程序的React Native WebView中禁用文本选择。使用css样式user select在站点上设置为none在使用设备或模拟器时似乎不起作用，但在浏览器中确实起作用。有没有办法使用React Native WebView禁用此功能，或者我需要使用一些本机代码来实现此功能使用React Native 0.30，iOS 9-10没有提到这一点，因此我将使用本机实现，这比看起来更容易。您只需在包含所需选项的本机模块中重新实现（可能还有其他一些模块），请参见和

我正在尝试找出如何在ios应用程序的React Native WebView中禁用文本选择。使用css样式

user select

在站点上设置为

none

在使用设备或模拟器时似乎不起作用，但在浏览器中确实起作用。有没有办法使用React Native WebView禁用此功能，或者我需要使用一些本机代码来实现此功能

使用React Native 0.30，iOS 9-10没有提到这一点，因此我将使用本机实现，这比看起来更容易。您只需在包含所需选项的本机模块中重新实现（可能还有其他一些模块），请参见和

也许这个软件包还可以帮助您实现您的模块：

我能够在React本机端禁用缩放、文本选择和其他指针事件，方法是在

视图中包装WebView
，并设置一些道具：
<View pointerEvents="none">
  <WebView
    source={{ uri: webviewUrl }}
    scrollEnabled={false}
  />
</View>

假设您在react native中访问webview上的特定url，那么在url中，您可以使用以下技巧：
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
 <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<div style="font-size:80%;padding-left:10px;padding-right:10px;">


<!DOCTYPE html>
<html>
<head>
  <script>
    function absorbEvent_(event) {
      var e = event || window.event;
      e.preventDefault && e.preventDefault();
      e.stopPropagation && e.stopPropagation();
      e.cancelBubble = true;
      e.returnValue = false;
      return false;
    }

    function preventLongPressMenu(node) {
      node.ontouchstart = absorbEvent_;
      node.ontouchmove = absorbEvent_;
      node.ontouchend = absorbEvent_;
      node.ontouchcancel = absorbEvent_;
    }

    function init() {
      preventLongPressMenu(document.getElementByTagName('body img'));
    }
  </script>
  <style>
    *:not(input):not(textarea) {
    -webkit-user-select: none; /* disable selection/Copy of UIWebView */
        -webkit-touch-callout: none; /* disable the IOS popup when long-press on a link */

    }
  </style>
</head>

<body onload="init()"  >


TEST<br>TEST<br>TEST<br>TEST<br>TEST<br>TEST<br>TEST<br>TEST<br>TEST<br>TEST<br>TEST<br>

</body>


功能吸收（事件）{
var e=事件| | window.event；
e、 preventDefault&&e.preventDefault（）；
e、 stopPropagation&e.stopPropagation（）；
e、 取消气泡=真；
e、 returnValue=false；
返回false；
}
功能防止长按功能表（节点）{
node.ontouchstart=吸收剂；
node.ontouchmove=吸收剂；
node.ontouchend=吸收系数；
node.ontouchcancel=吸收剂；
}
函数init（）{
PreventLongPress菜单（document.getElementByTagName（'body img'））；
}
*：not（输入）：not（文本区域）{
-webkit用户选择：无；/*禁用UIWebView的选择/复制*/
-webkit touch callout:none；/*长按链接时禁用IOS弹出窗口*/
}
测试
测试
测试
测试
测试
测试
测试
测试
测试
测试
测试
测试


上述操作将禁用文本选择，但允许“单击”等其他功能。（它在iOS和android设备中都能工作）
享受…
添加此功能后，将禁用所有webview触摸功能。有没有办法禁用长按以避免复制选择粘贴选项？