相关疑难解决方法(0)

在我的 HTML 页面上有一个元素，上面有一些文本。我指定了单击该元素时要发生的操作。当用户连续多次点击元素时，有时会发生双击，导致文本被选中（突出显示），从而损坏外观。我尝试使用虚拟事件处理程序来阻止它，该处理程序可阻止双击 (dblclick) 事件的默认行为。然而，这似乎不起作用。似乎在执行我的虚拟事件处理程序之前，文本已被选择并突出显示。

function doNothing(event) {
  alert('doNothing'); // Added for debugging. The alert is shown, meaning the event handler is invoked. When I get the alert, the text is already highlighted.
  if(!event) event = window.event;
  if(event.preventDefault) event.preventDefault();
  event.cancelBubble = true;
  if(event.stopPropagation) event.stopPropagation();
  return false;
}

myElem.onlick = doSomething; // This is the event for a single click. Works well.
myElem.ondblclick = doNothing; // The event handler is called, but the text is already highlighted.

具体问题：

1）我所追求的与双击事件有任何关系吗？（正如我看到的，当警报响起时，文本已经突出显示，我怀疑这可能是另一种机制。我怀疑（单击）事件的默认行为可能与它有关，但我取消了默认行为（单次）点击事件也是如此。）

2）如果它与 dblclick …

我有一种情况，当我点击一个按钮时，我需要点击前的当前选择。示例代码如下

$('div#test').on('click', 'span', function () {
    sel = window.getSelection();
    $('div#out p').text(sel.toString());
});

此处显示了预期的行为 - http://jsfiddle.net/yvondtm/NH2DW/

单击图像按钮时一切正常。如果您在单击图像之前进行选择，则会得到输出——这里只是您选择的副本。

但是如果你点击一个文本按钮，选择就会丢失，结果和预期的不一样。似乎单击文本会移动光标并因此更改选择。

我已经检查过像这样的CSS 解决方案来禁用选择，正如我在小提琴中放入的那样，-webkit-user-select: none;. 它按照它说的做，但没有任何帮助 - 即使不允许选择“范围”，插入符号仍然移动！

我怎么解决这个问题？我是否必须找到某种方法将文本按钮转换为图像？

（使用 js 或 jquery 或 css 来实现这一点都没有问题。）

我最近构建了一个示例HTML网页,当我将鼠标指针悬停在一个<div>元素上,使得下拉菜单点击时,指针变为光标,允许我突出显示文本<div>.

问题是,我不希望鼠标指针改变为光标.(我也不希望能够突出显示文本.)我希望它保持原样或改为'可点击当鼠标指针悬停在链接上时出现的手'指针.

我怎样才能做到这一点？

这不是上述问题的重复

我material-icons在我的网站上使用.为了添加图标,你必须做这样的事情:

<p class="material-icons">info_outline</p>

如果我现在复制该图标,它将复制文本"info_outline".我知道你可以user-select: none;在你里面使用一个不可选择的元素css,但是有一个问题.

以我的片段为例.如果我创建一个p元素,span内部有一个元素,user-select: none;你将无法选择(并因此复制)跨度.但是,如果您复制整个p元素,您仍将获得该元素的内容span.我怎样才能防止这种情况发生？

span {
  user-select: none;
}

input {
  width: 100%;
}

<p>Copy this text with a <span>unselectable</span> piece of text... Or is it?</p>
<input type="text" placeholder="Past text here">

编辑: 由于很多人都说答案是问题的重复问题,所以user-select: none;再看看我的问题.

我知道用户选择如何工作!我知道你可以让一个元素无法选择.但是,如果你选择它周围的元素并复制它的内容,它将复制它的所有内容,甚至是复制它的元素.user-select: none;

我想禁用点击确定,<div>以便当您选择文本时,文本不会选择.

我尝试写onclick="return false;"这个小提琴http://jsfiddle.net/mageek/X6hqD/,但它不起作用.

它怎么样？(我的目标不仅仅是禁用选择,而是整个点击).

注意:这个问题与如何使用CSS禁用文本选择突出显示不同？

在问之前我从上面的问题中读了讨论历史.一切正常,但我可以允许CTRL+A(全选)仅适用于输入元素.

那是因为我正在桌面上部署我的HTML5应用程序,我希望从GUI/Forms应用程序中获得相同的行为.

什么是起点？尝试用keypress事件绑定所有元素并观察CTRL + A keyCode？这种方法的缺点是必须控制一切并注意重新渲染.

我更喜欢CSS解决方案,但欢迎任何想法.

提前致谢.

@EDIT:我找到了这个ulgy解决方案,但正在工作:

$(document).keydown(function(objEvent) {
    if (objEvent.ctrlKey) {
        if ((objEvent.keyCode === 65) || (objEvent.keyCode == 97)) {
            if ($(objEvent.target).not("input").disableTextSelect().length) {
                return false;
            }
        }
    }
});

我有一个内容可编辑的div,我希望点击编辑按钮,光标出现在div的开头,在它结束时出现的那一刻.

<li style="display: list-item;" class="menu-item" contenteditable="true">
<div class="">Dior<input type="checkbox" name="selected"></div>
<ol class="">
    <li style="display: list-item;" class="menu-item">
    <div class=""><a href="/portfolios/charlize-theron" class="" name="">Charlize-Theron</a>
    <input type="checkbox" name="selected"></div>
    </li>
    <li style="display: list-item;" class="menu-item">
    <div class=""><a href="/portfolios/natalie-portman" class="" name="">Natalie-Portman</a>
    <input type="checkbox" name="selected"></div>
    </li>
    <li style="display: list-item;" class="">
    <div class=""><a href="/portfolios/sharon-stone-1" class="" name="">Sharon-Stone</a>
    <input type="checkbox" name="selected"></div>
    </li>
</ol>
<a href="#" class="edit" style="opacity: 1; ">Edit</a></li>

因此,当您在分钟点击编辑时,您必须使用箭头键返回到开始编辑Dior(这是唯一真正被编辑的东西).但我试图将内容可编辑的代码添加到div只有它不起作用.

这是我的一些jQuery

$(".edit").click(function(){
            $(this).parent().children("div").focus(function(){

            });
        });

        $(".edit").hover(function(){
            $(this).css("opacity","0.5")
        }, function(){
            $(this).css("opacity","1")
        });

        $(".edit").parent().blur(function(){
            var sortableList = $(".sortable").html();
            $("#ItemDescription").val(sortableList);
        });

function storeUserScribble(id) { …

我有点困惑为什么这段代码不起作用!

HTML标记:

<div id="diva"><b>Score</b> some <i>goals</i></div>
<div id="soda"></div>

JavaScript代码:

function GetSelectedText () {
if (window.getSelection) {  // all browsers, except IE before version 9
    var range = window.getSelection ();
    alert (range.toString ());
} 
else {
    if (document.selection.createRange) { // Internet Explorer
        var range = document.selection.createRange ();
        alert (range.text);
    }
}
}

var butn = document.getElementById("soda");
butn.onclick = function(){
    GetSelectedText();
}

我不完全确定如何研究这个想法.我确信它已经完成了,但是我有一个问题是为了有效的谷歌搜索.

我有一个结果页面,可以选择将结果下载到csv.但我想有时候用户宁愿只是在页面上复制并粘贴可见结果.如何在复制/粘贴时获得它,它只显示结果而不显示标题.

<h1>results #1</h1>
<p>here are all of your awesome results</p>
<p>here are all of your awesome results</p>
<span> showing 2 of 2 </span>

所以在我的示例代码中,他们只复制<p>元素而不是<h1>或<span>.

我认为这将是一个javascript/jquery解决方案,我很好.但实际上还不确定从哪里开始.这可以合理地完成吗？

我正在尝试制作一个网站。我使用表格制作了标题，当您突出显示它时，它看起来很俗气。

.topmenu::selection 
    {
    background: rgba(255,79,79,0); /* Change highlight color */
    }

我通过<div class="topmenu::selection">在 PHP 中使用来调用它。我是否错误地调用了此代码？

谢谢！

编辑：这似乎不太奏效。如果有任何更改，我正在使用表达式引擎。这是我到目前为止的工作：

<meta http-equiv="Content-Type" content="text/html; charset={charset}" /> <link rel="shortcut icon" href="/Flame.ico" />
 <title>New Hope Christian College</title>
 <link rel="stylesheet" type="text/css" href="/nhcc-css/text.css" /> 
<center> 
<table width="960" border="0" div class="topmenu">

.topmenu {
    FONT-SIZE: 12px; COLOR: #000000;
    FONT-FAMILY: Arial, Helvetica, sans-serif;
}

.topmenu::selection {
    background: transparent;
}
.topmenu::-moz-selection {
    background: transparent;
}
.topmenu a {
    color: #A71137; text-decoration: none;
}
a:hover {
    COLOR: #000000;
    text-decoration: none;
} …