0

次のHTMLフラグメントをドキュメントに追加し、display_spinnerパラメータの値を置き換える必要があります。

<script type="text/javascript" src="http://public.tableausoftware.com/javascripts/api/viz_v1.js"></script>
<div class="tableauPlaceholder" id="tableauPlaceholder" style="visibility:hidden;width:654px; height:1469px;background-image: url('http://tableau.russellchristopher.org:81/Background.gif'); top: 0px; left: 0px; width: 100%; margin-left: 76px;">
    <noscript>
        <a href="#"><img alt="Analytics, Inc. " 
                    src="http://tableau.russellchristopher.org:81/Background.gif" 
                    style="border: none" /></a>
    </noscript>
    <object class="tableauViz" width="654" height="1469" style="display:none;">
        <param name="host_url" value="http%3A%2F%2Fpublic.tableausoftware.com%2F"
        />
        <param name="site_root" value="" />
        <param name="name" value="AnalyticsIncJavaScript&#47;AnalyticsInc" />
        <param name="tabs" value="no" />
        <param name="toolbar" value="yes" />
        <param name="static_image" value="tableau.russellchristopher.org:81/Background.gif"
        />
        <param name="animate_transition" value="yes" />
        <param name="display_static_image" value="yes" />
        <param name="display_spinner" value="" id="display_spinner" />
        <param name="display_overlay" value="yes" />
        <param name="display_count" value="yes" />
    </object>
</div>

これが私が思いついたものです（JSFiddleはこちら：http ：//jsfiddle.net/9vBGq/ ）

$(document).ready(function () {
    var $placeholder = $('<div class="tableauPlaceholder" style="width:654px; height:1469px;background-image:  url("http%3A%2F%2Ftableau.russellchristopher.org:81%2FBackground.gif"); top: 0px; left: 0px; width: 100%; margin-left: 76px;"></div>'),
        $noscript = $('<noscript> <a href="#"><img alt="Analytics, Inc. " src="http%3A%2F%2Ftableau.russellchristopher.org:81/Background.gif" style="border: none" /></a></noscript>'),
        $tableauViz = $('<object class="tableauViz" width="654" height="1469"></object>'),
        $host_url = $('<param name="host_url" value="http%3A%2F%2Fpublic.tableausoftware.com%2F">'),
        $site_root = $('<param name="site_root" value="" />'),
        $sheetName = $('<param name="name" value="AnalyticsIncJavaScript&#47;AnalyticsInc" />'),
        $tabs = $('<param name="tabs" value="no" />'),
        $toolbar = $('<param name="toolbar" value="yes" />'),
        $static_image = $('<param name="static_image" value="http://tableau.russellchristopher.org:81/Background.gif"/>'),
        $animate_trasnsition = $('<param name="animate_transition" value="yes" />'),
        $display_static_image = $('<param name="display_static_image" value="yes" />'),
        $display_overlay = $('<param name="display_overlay" value="yes" />'),
        $display_count = $('<param name="display_count" value="yes" />'),
        $display_spinner = $('<param name="display_spinner" value="' + 'no' + '" />');
    $placeholder.append($noscript).append($tableauViz).append($host_url).append($site_root).append($sheetName).append($tabs).append($toolbar).append($static_image).append($animate_trasnsition).append($display_static_image).append($display_overlay).append($display_count).append($display_spinner).appendTo('body');
    console.log(document.body);
});​

console.logで確認できることから、複数の問題があります-そして、私はまだこの問題に慣れていないため、正確な理由を知ることができません。

ここに画像の説明を入力してください

  • 私のURLエンコードは壊れているように<div>見えます。私は何を間違えましたか？
  • <a>noscriptブロック内にネストされたタグの見栄えが悪い
  • パラメータを一覧表示した後、閉じる必要があるときに終了</object>タグがあります
  • 私のパラメータのそれぞれを閉じる/>ことができません-再びURLエンコードの奇妙さ、私は推測しますが、どのように処理するかはわかりません。

私はあなたがプロだと思い、数秒で正しい方向に私を蹴ります....あなたが適切だと思うように私を蹴ってください？ありがとう。

4

2 に答える 2

2

最良の解決策は、HTMLでテンプレートを作成し、javascriptで作成する代わりにそれを読むことだと思います..

何かのようなもの

<!-- template code follows -->
<script type="text/template" id="tableau">
<div class="tableauPlaceholder" id="tableauPlaceholder" ..
..snip..
        <param name="display_spinner" value="{placeholder}" id="display_spinner" />
..snip..
</div>
</script>
<!-- end of template -->

次に、テンプレートをロードしてプレースホルダーを変更するには、このコードが必要です

var template = $('#tableau').html(),
    filledTemplate = template.replace('{placeholder}','value for spinner');

$('body').append( filledTemplate );

http://jsfiddle.net/gaby/9vBGq/1/のデモ

(すべてがスクリプトを介して行われるため、テンプレートから要素を削除しましたnoscript)

于 2012-05-25T13:57:32.407 に答える
1

私の見た目の URL エンコーディングが壊れています。私は何を間違えましたか？

スタイルの終了が早すぎました。背景画像の URL から引用符を削除します。

var $placeholder = $('<div style="background: url(some_very_long_url)"></div>')

パラメータをリストした後に終了する必要がある終了タグがあります

それはすでにそれ自体を閉じました。あなたがしたことは、パラメータを に追加することでした$placeholder。必要な場合は、パラメータを$tableauViz 追加する必要があります。

$tableauViz.append(stuff).append(some_more_stuff)

各 my params で /> を閉じます。これも URL エンコーディングの奇妙さです。処理方法がわかりません。

コンソールは/>during 表示を無視します。大丈夫です、みんな兄弟です。そうでない場合、各パラメーターは前のパラメーターにネストされていました。

については<noscript>、JS をオフにしてテストします。そうすれば、正しくレンダリングされたかどうかを確認できます。

于 2012-05-25T13:52:38.960 に答える