0

JavaScript を使用して HTML ループを作成しています。一連の画像をループし、追加情報とともに表示します。ここに示すように、HTML 出力には常に NaN が表示されるようです。ここに画像の説明を入力

問題のJavaScriptは次のとおりです。

var caption = '<p></p>';
if($.isEmptyObject(data[i].caption) !== true)
{
    caption = '<p class="caption" style="top:'+data[i].height+'px;">'+
            data[i].caption +
          '</p>';
}
var li = '<li data-uk-modal="{target:#modal-open-image}"'
        + 'class="open"'
        + 'image="'+ data[i].photo +'"'
            + 'caption_height="'+ data[i].height +'"'
        + 'caption="'+ data[i].caption +'">'
        + '<a href="#" class="uk-thumbnail uk-overlay-toggle">'
        + '<div class="uk-overlay">'
        + '<img src="'+ data[i].photo +'" width="250px"/>'
        + caption +
        + '<div class="uk-overlay-caption">'
        + '<p> Sender: ' + data[i].sender + '</p>'
            + '<p> Date: ' + data[i].date + '</p>'
            + '<p> limit: '+ data[i].limit + '</p>'
        + '<p> counter: ' + data[i].counter + '</p>'
        + '</div>'
        + '</div>'
        + '</a>'
        +'</li>';
        $photo.append(li);

ここに画像の説明を入力

問題はキャプション変数にあると思います。data[i] は、データベース クエリからの配列です。

ここに画像の説明を入力

data[i].caption に何かあるかどうかを確認する必要があります。length を使用してみましたが、うまくいかないので、オブジェクトが存在するかどうかを確認します。それが機能するかどうかはわかりませんが。

私の質問は、キャプションが空であるかどうかを適切に表示する方法です。キャプションがない場合は、var li に何も追加しません。

ありがとう。

4

3 に答える 3

0

フィードバックをお寄せいただきありがとうございます。私はあなたが私をゲームする解決策をどうにかして飲み込み、これに行き着きました.

var height = (data[i].height == null)?0:data[i].height;
var caption= (data[i].caption== null)?'':data[i].caption;   
var li = '<li data-uk-modal="{target:\'#modal-open-image\'}"'
        + 'class="open"'
        + 'image="'+ data[i].photo +'"'
        + 'caption_height="'+ height +'"'
        + 'caption="'+ caption +'">'
        + '<a href="#" class="uk-thumbnail uk-overlay-toggle">'
        + '<div class="uk-overlay">'
        + '<img src="'+ data[i].photo +'" width="250px"/>'
        + '<p class="caption" style="top:' + height +'px;">'
        + caption
        + '</p>'
        + '<div class="uk-thumbnail-caption">'
        + '<p> Sender: ' + data[i].sender + '</p>'
        + '<p> Reciever: '+ data[i].reciever + '</p>'
        + '<p> Date: ' + data[i].date + '</p>'
        + '<p> limit: '+ data[i].limit + '</p>'
        + '</div>'
        + '</div>'
        + '</a>'
        +'</li>';
于 2013-09-17T07:47:54.940 に答える
0

1 行でコーディングできます。

( (data && data[i] && data[i].caption) ? " your stuff " : "")

ただし、javascript で 'data[i].caption' をチェックすると、ゼロは false、空の文字列は false になることに注意してください。さらに、数値を参照する場合は、メソッドisNaNを使用して条件を追加できます

于 2013-09-17T06:35:43.433 に答える
0

「+ キャプション +」の代わりにこれを使用してください

isNaN(data[i].caption) ? '' : data[i].caption 

or if(isNaN(data[i].caption)==true){

  //do somthing
}else{

 //do somthing

}
于 2013-09-17T06:41:31.037 に答える