0

ホバー時に「ポップアップ」divを作成したリンクのリストがあります。リンクはすべて のようなクエリを指しています?page=link1。クエリの後に値を取得しようとしているのでlink1、それを div の html に入れます。今のところ .match では何も起こりません。.attr('href') だけを使用すると、「未定義」の応答が返されます。

誰かが私が間違っていることを教えてもらえますか?

フィドルはこちら

そして、私が今持っているコードをここに示します。私を正しい方向に導くためのどんな種類の助けも素晴らしいでしょう。私は私が近いことを知っています.jqueryについてはまだ十分に理解していません.

jQuery

$(document).ready(function() {
    var moveLeft = 20;
    var moveDown = 10;
    $('#pops').hover(function(a) {
        var file = $(this).attr("href").match(/page=([0-9]+)/)[1];
        $('#pop-up').html('file name is ' + file);
        $('#pop-up').show();
        return false
        a.preventDefault();
    });
    $('#pops').mousemove(function(b) {
        $("#pop-up").css('top', b.pageY + moveDown).css('left', b.pageX + moveLeft);
        return false
        b.preventDefault();
    });
});​

HTML

更新:リンクの説明が間違っていました。クエリには、実際には数字、文字、および小数が含まれます。

<div id="pops">
 <a href="content.asp?page=ns2.6">link 1</a><br>
 <a href="content.asp?page=ns3.8">link 2</a><br>
 <a href="content.asp?page=jp1.0">link 3</a><br>
 <a href="content.asp?page=jp2.1">link 4</a><br>
</div>
<div id="pop-up"></div>   
4

6 に答える 6

3

セレクターと正規表現が間違っています。<a>取得するには を選択する必要があり、正規表現でhrefを忘れましlinkた。

        $('#pops a').hover(function(a) {
            var file = $(this).attr("href").match(/page=(link[0-9]+)/)[1];

フィドル

この正規表現は、指定されたすべてのサンプルに一致します/page=([a-z]{2}\d\.\d)/

http://jsfiddle.net/mowglisanu/9X7ee/8/

于 2012-07-31T20:44:25.010 に答える
2

ホバー機能は次のようになります。

$('#pops a').hover(function(e) {
    var file = $(this).attr("href").match(/page=(.*)/)[1];
    $('#pop-up').html('file name is ' + file);
    $('#pop-up').show();
    return false
    a.preventDefault();
});

jsFiddleの例

セレクターが間違っていて(である必要があります$('#pops a'))、正規表現も正しくない(である必要があります)ことに注意してください/page=(.*)/

于 2012-07-31T20:45:57.163 に答える
1

わかりましたので、コードにいくつかの問題があります:

1 - コンテナーではなく、アンカー自体にホバーを関連付ける必要があります。すなわち $('#pops a').hover(function(a) { ... });

$(this).attr("href")...thisを使用すると #pops コンテナーを参照しますが、実際のアンカーを参照する必要があります。

2 - 間違った正規表現に一致していました。

以下のコードは、あなたのフィドルでテストされています。

それが役に立てば幸い。

$(document).ready(function() {
        var moveLeft = 20;
        var moveDown = 10;

        $('#pops a').hover(function(a) {
        var file = $(this).attr("href").match(/link\d/i);

        $('#pop-up').html('file name is ' + file);
        $('#pop-up').show();

        return false
        a.preventDefault();
        });

        $('#pops').mousemove(function(b) {
        $("#pop-up").css('top', b.pageY + moveDown).css('left', b.pageX + moveLeft);

        return false
        b.preventDefault();
        });    
});​
于 2012-07-31T20:54:49.797 に答える
1

「this」を使用する場合は、「a」要素をターゲットにする必要があります。

$('#pops').hover(function(a) {

する必要があります:

$('#pops a').hover(function(a) {

JavaScript 分割メソッドを使用して、次のように配列の 2 番目の値を選択することで、ファイル名を取得できます。

var fileName = file.split("=")[1];
于 2012-07-31T20:44:43.930 に答える
0

正規表現は/page=link([0-9]+)/

于 2012-07-31T20:42:03.490 に答える
0

href attr のページ内の番号のみが発生する場合は、単純に

var file = $(this).attr("href").match(/([0-9]+)/);
于 2012-07-31T20:51:24.847 に答える