引導程序3：動態模式框

Question

在單擊動態圖像鏈接並從iframe模態框（圖像管理器）中選擇圖像后，我使用bootstrap 3.0模態框來顯示/將圖像URL添加到輸入框。

PHP / HTML：

<div class="filesmap">
    <input id="video-12" class="form-control" type="text" name="video[]" value="'.$url.'">
</div> <span class="filesicon"><a id="video-12" data-target="#myModal" href="#" data-toggle="modal" type="button"><i class="mce-ico mce-i-browse"></i></a></span>

<div class="filesmap">
    <input id="video-90" class="form-control" type="text" name="video[]" value="'.$url.'">
</div> <span class="filesicon"><a id="video-90" data-target="#myModal" href="#" data-toggle="modal" type="button"><i class="mce-ico mce-i-browse"></i></a></span>

<div class="filesmap">
    <input id="video-80" class="form-control" type="text" name="video[]" value="'.$url.'">
</div> <span class="filesicon"><a id="video-80" data-target="#myModal" href="#" data-toggle="modal" type="button"><i class="mce-ico mce-i-browse"></i></a></span>

在模態框（靜態）中：

<div class="modal fade" id="myModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                 <h4 class="modal-title">Modal title</h4>

            </div>
            <div class="modal-body" style="padding:0px; margin:0px width: 560px;">
                <iframe width="560" height="400" src="/dialog.php?type=0&fldr=&field_id=video&&akey=dsflFWR9u2xQa" frameborder="0" style="overflow: scroll; overflow-x: hidden; overflow-y: scroll; "></iframe>
            </div>
        </div>
    </div>
</div>

現在，要將圖像網址從模式框添加到輸入框，我為輸入框添加動態ID（例如： id="video-90" ），並與field_id （iframe src）同步。

我需要為每個具有動態iframe / src鏈接的輸入框打開模式框，如下所示：

src="/dialog.php?type=0&fldr=&field_id=video-12&&akey=dsflFWR9u2xQa"

src="/dialog.php?type=0&fldr=&field_id=video-90&&akey=dsflFWR9u2xQa"

src="/dialog.php?type=0&fldr=&field_id=video-80&&akey=dsflFWR9u2xQa"

我的意思是針對相同的視頻ID（iframe src）打開點擊鏈接模式后。

我該如何創建呢？

Answer 1

我不知道我是否正確理解了您的問題，但是如果您的意思是所有模態都包含相同的內容，請嘗試這種對我有用的解決方案

1-每個模態的ID應該是不同的示例

<div class="modal fade" id="myModal-'different-id'">
...
</div>

2-這也應該反映在您觸發觸發模式的數據目標中

data-target="#myModal-'different-id'"

3-我也建議使用此jQuery函數觸發模式*

$(function () { $("[data-toggle='modal']").modal();});

• 如果模態處於活動狀態而沒有觸發，請改用此功能

  $（function（）{$（“ [data-toggle ='modal']”）。modal（“ hide”）;}）;