0

誰かが私を助けてくれるのではないかと思います。

ここに示すように、ユーザーがアップロードした画像をギャラリー形式で表示できるようにするスクリプトをまとめました。

ここでjQueryデモを使用して、ユーザーが削除する画像を選択したときに表示されるカスタムダイアログボックスを実装しようとしています。以下の抜粋に示すように、すでにエラーメッセージが書かれています。

Galleria.ready(function() {
    this.$('thumblink').click();

    $(".galleria-image").append("<span class='btn-delete'></span>");  
    $(".btn-delete").live("click", function() {
        var img = $(this).closest(".galleria-image").find("img");      
        alert('Deleting image... ' + $(img).attr("src"));     
        return false; 
    }); 
});

私が抱えている問題はdiv、ダイアログボックスに必要な周囲を作成する方法が見つからないことです。私はJavascriptに比較的慣れていないので、これは本当に基本的なエラーかもしれませんが、誰かがこれを見て、どこが間違っているのか教えてくれないかと思っただけです。

よろしくお願いします

4

3 に答える 3

0

あなたはこれを行うことができます：

$('<div>').html('Deleting image... ' + $(img).attr("src")).dialog({autoOpen:true});

-

私はこれがあなたのために働くと思います：

Galleria.ready(function() {
    this.$('thumblink').click();

    $(".galleria-image").append("<span class='btn-delete'></span>");  
    $(".btn-delete").live("click", function() {
        var img = $(this).closest(".galleria-image").find("img");      

// Dialog
var dialog=$('<div>').addClass('cDialog').html('Deleting image... ' + $(img).attr("src")).appendTo('#galleria').hide().fadeIn();

// On Success Delete You Can Do
// dialog.text('Deleted').delay(1000).remove();
// or

// dialog.remove();

        return false; 
    }); 
});

CSS：

#galleria{
overflow:hidden;
position:relative;
}

.cDialog{
width:100%;
position:absolute;
top:0;
right:0;
padding:13px;
background-color:#F2F2F2;
text-align:center;
}
于 2012-05-07T13:51:26.137 に答える
0

画像の周りにdivが必要ですか？

画像の周りにdivを簡単にラップできます。

  <div id="inner">Hello/>

以下のコードを使用してみてください。

$('#inner').wrap('<div class="new" />');

出力は次のようになります。

<div class="new">
    <div id="inner">Hello</div>
  </div>
于 2012-05-07T13:55:35.317 に答える
0

まず、画像削除リンクを正しく設定する必要があります。

好き：

<a title="delete img.jpg" href="delete.php?img={$id}"><span class="btn-delete"></span></a>

それから：

Galleria.ready(function() {
    this.$('thumblink').click();

    $(".galleria-image").append("<span class='btn-delete'></span>");  
    $(".btn-delete").parent().live("click", function() {
        var link = this.href;  // Get Image delete link    

        var dialog = $("<div>").text("Are you want to " + this.title + " ?");
        dialog.dialog({
            resizable: false,
            height:140,
            modal: true,
            buttons: {
                "Delete all items": function() {
                    var result = $.get(link + "&ajax=1"); // you must echo "YES" with php if success of "NO" if false
                    if(result == "YES"){
                       // Show 
                       // alert('Deleted');
                    } else {
                        // Fail
                        // Try Again

                    }
                    $( this ).dialog( "close" );
                },
                Cancel: function() {
                    $( this ).dialog( "close" );
                }
            }
        });

        return false; 
    }); 
});
于 2012-05-07T15:00:48.180 に答える