0

テーブルの行にクリック イベントが関連付けられています (任意のオブジェクトである可能性があります)。

<table>
<tr class="row"><td>http://google.com</td></tr>
<tr class="row"><td>http://teslamotors.com</td></tr>
<tr class="row"><td>http://solarcity.com</td></tr>
</table>

<script>
    $(document).ready(function() {
       $(".row").click(function() {
           var href = $(this).find("td").html();
           window.location.href = href;
       }
    }
</script>

行にクリック イベントがある場合、左クリックしてテキストを強調表示し始めると、ユーザーがコピー/貼り付けを行う前にクリック イベントが発生します。

ユーザーがコピーと貼り付けのためにその行のテキストを選択できるようにするにはどうすればよいですか?

注: この質問は説明用です。私自身の回答を提供します。

4

3 に答える 3

0

それよりもはるかに簡単です。

var down = '';
var up = '';
$('.row td').on('mousedown', function (e) {
    down = e.pageX+','+e.pageY;
}).on('mouseup', function (e) {
    up = e.pageX+','+e.pageY;
    if(up === down) {
        window.location.href = $(this).html();
    }
});

マウスの位置を下に、そして再び上にキャッチします。それらが一致する場合、マウスは移動していないため、リンクが表示されるはずです。そうでない場合は、おそらくテキストを選択しています。

フィドルを作った：http://jsfiddle.net/filever10/2fm23/

于 2013-10-24T19:58:20.100 に答える
0

答えはタグにあります。mousedownおよびmouseupイベントをキャプチャしました。

  1. 最初にmousedownイベントをキャッチし、状態を保存します。
  2. 次にmouseupイベントをキャッチし、座標と状態を比較しmousedownます。
  3. イベント間でマウスが大きく移動した場合は、クリックを処理しないでください。

上記のスクリプト セクションを次のように置き換えます。

<script>
$(document).ready(function() {
    var lastMouseDownEvent = null;

    // capture your last "mousedown" event and store it
    $(".row").mousedown(function(event) {
        console.log(event); // lets see the data in your Developer Mode log
        lastMouseDownEvent = event;
    });

    // catch the "mouseup" event and compare the distance from "mousedown"
    $(".row").mouseup(function(event) {
        console.log(event);

        var href = $(this).find("td").html();
        switch(event.which) {
            case 1: // left click
                // only process left click if mousedown and mouseup occur at the same location on screen.
                // NOTE: for my mom's shaky hand I added the 5 pixel allowance.
                if (Math.abs(event.clientX-lastMouseDownEvent.clientX) < 5 &&
                    Math.abs(event.clientY-lastMouseDownEvent.clientY < 5))
                    window.location.href = href;
                break;
        }
        lastMouseDownEvent = null;
    });
});
</script>
于 2013-10-24T19:35:59.660 に答える