1

ページのファイル アップロード ボタンを押すたびに、ページに存在するすべてのファイル アップロード ボタンがトリガーされます。各ボタンは同じクラスであるため、$(this) セレクターを適用して、応答を 1 つのファイル アップロード ウィンドウに制限しようとしました。

HTML

        <div id="sectionInfo">
            <div id="sectionWrap">
                <div id="sectionInner">
                    <label class="inst head">Section 1</label>
                    <input class="textOver" type="text" name="sectionTitle1" value="<?php echo $title; ?>" placeholder="Section Title" onfocus="this.select();">
                    <label class="inst ib">Please enter any text you would like associated with the section.</label>
                    <textarea style="margin-top: 3px" name="sectionContent1" value="<?php echo $body; ?>" onfocus="this.select();" placeholder="Section Description"></textarea>
                    <label class="inst ib">Please upload the image associated with this section, .PNG required.</label>
                    <input type="file" style="visibility:hidden;" name="sectionImg1" class="upload" />
                    <input type="button" id="fileStyle" class="fSOver fileStyle" value="Upload Section Image!" />

                </div>
            </div>
        </div>

このブロックには複数のインスタンスがあり、サイト管理者はいくつかの javascipt を介してページに無限のノードを動的に追加できます。これが私の問題です。使いやすさの観点からすると、ボタンを 1 回クリックするだけで 30 個のセクションに対して 30 個のウィンドウが連続して開くと、まったく厄介なことになります。

私の現在のJSは次のようになります

    $(function(){
        $(document).on("click", '.fileStyle', function(){
           $('.upload').click();
        });
    });

対象のボタンに対してのみファイル アップロード ダイアログを表示するにはどうすればよいですか?

4

1 に答える 1

1

これを試して：

$(function()
{
    $(document).on("click", '.fileStyle', function()
    {
        $(this).siblings('.upload').click();
    });
});

また

$(function()
{
    $(document).on("click", '.fileStyle', function()
    {
        $(this).prev().click();
    });
});
于 2013-09-05T21:56:31.400 に答える