1

コードは次のとおりです。

$(document).ready(function () {
$('#url0, #url1, #url2, #url3, #url4, #url5, #url6, #url7, #url8, #url9, #url10').each(function(index, element) {
    $(element).blur(function() {
        var vals = this.value.split(/\s+/);
        var $container = $(this).hide().prev().show().empty();

        $.each(vals, function(i, val) {
            if (i > 0) {
                $("<span> </span>").appendTo($container);
            }

            $("<a />")
                .html(val)
                .attr('href',/^https?:\/\//.test(val) ? val : 'http://' + val)
                .appendTo($container)
                .click(handleClickEvent);
        });
    });
}).trigger('blur');

// ms to wait for a doubleclick
var doubleClickThreshold = 300;
// timeout container
var clickTimeout;

$('.aCustomDiv a').click(handleClickEvent);
$('.aCustomDiv').click(handleDivClick);

function handleClickEvent(e) {
    var that = this;
    var event;

    if (clickTimeout) {
        try {
 clearTimeout(clickTimeout);
        } catch(x) {};

        clickTimeout = null;
        handleDoubleClick.call(that, e);
        return false;
    }

    clickTimeout = setTimeout(function() {
        clickTimeout = null;
        handleClick.call(that, event);
    }, doubleClickThreshold);

    return false;
}

function handleDivClick(e) {
    var $this = $(this);

    $this.parent()
        .find('input,textarea')
        .show()
        .focus();
    $this.hide();
}

function handleDoubleClick(e) {
    var $this = $(this).parent();
 $this.parent()
        .find('input,textarea')
        //.val($a.text())
        .show()
        .focus();
    $this.hide();
}

function handleClick(e) {
    window.open(this.href, '_blank')
}
});

HTML コード:

<div style="padding:0 !important;margin-top:8px !important;">
<div class="aCustomDiv" style="padding: 0px ! important; display: block;">
    <a href="http://www.google.com">www.google.com</a><span></span><a href="http://www.facebook.com">www.facebook.com</a><span></span><a href="http://www.wikipedia.org">www.wikipedia.org</a>
</div>
<input type="text" value="www.google.com www.facebook.com www.wikipedia.org" onchange="immediateEditItemInCart(this.value,'url',0,'pr','35')" class="mandatory0" id="url0" style="display: none;" readonly="readonly">

このスクリプトは次のことを行います。

  1. これらの ID (url0 ...) のテキストを URL に変換します。
  2. リンクをダブルクリックすると編集可能になります
  3. div 領域を 1 回クリックすると、リンクの横にある編集可能になります
  4. リンクを 1 回クリック => ページに移動

私の問題:何らかの理由で、リンクを1回クリックしてもページに移動せず、編集します.最初の時間だけ、その後はうまく機能するので、最初の関数もonloadと呼ばれるようにしますぼかす時だけではありません。これどうやってするの ?

4

1 に答える 1

0

起動時の読み込みに関しては、javascript はシングル スレッドなので、順序を守っていればメソッドを起動するだけで機能します (... かっこをいくつか追加するだけです)。しかし、DOM にアクセスしようとしているので、要素が使用可能になるまで待機する必要があります (そうしないと、セレクターから何も返されません)。

しかし、あなたはすでに持っています:

$(document).ready( function(){} );

これはまさにあなたが求めていることを行います。また、次の省略形もあります。

$( function(){} );

だから私は Rodneyrehm に同意する必要があります。それはおそらく、ページ上の他の js との衝突です。それが問題ではないことを確認するために、名前空間に少しカプセル化することをお勧めします。

問題が解決しない場合の出発点として、簡単なバージョンを作成しました: http://jsfiddle.net/scispear/dUWwB/。あなたのajax呼び出し(あなたが言及した)がフィールドに事前入力していた場合に備えて、「updateURL」メソッドを引き出しました(そのようにして値も渡すことができます)。

また、複数の入力/ディスプレイでも動作しますが、これは 100% 確信が持てなかったと思います。

于 2012-07-06T19:37:38.343 に答える