我已經放在一起PHP腳本和允許用戶上傳圖像文件的小形式。就目前而言,這是通過父HTML頁面上的按鈕的「onclick」事件作爲彈出窗口激活的。替代彈出窗口
從我在這個網站上做的研究中,我知道'彈出窗口'並不是每個人都喜歡的,所以我真的在尋求一些建議,看看是否有其他的選擇窗口。我已經嘗試了jQuery模態對話框,並且遇到了各種各樣的問題,因爲我有多個提交按鈕,所以如果可能的話,我寧願不轉換,儘管模式對話框的樣式是沿着正確的線條。
我已經放在一起PHP腳本和允許用戶上傳圖像文件的小形式。就目前而言,這是通過父HTML頁面上的按鈕的「onclick」事件作爲彈出窗口激活的。替代彈出窗口
從我在這個網站上做的研究中,我知道'彈出窗口'並不是每個人都喜歡的,所以我真的在尋求一些建議,看看是否有其他的選擇窗口。我已經嘗試了jQuery模態對話框,並且遇到了各種各樣的問題,因爲我有多個提交按鈕,所以如果可能的話,我寧願不轉換,儘管模式對話框的樣式是沿着正確的線條。
就我個人而言,我是JQuery UI模式對話的粉絲,因爲它是輕量級的,我已經在我的應用中加載UI。
但還有更多的事情在這裏......問題不在於對話框,而是您嘗試在對話框中進行文件上傳的事實。上傳文件的傳統方法是通過$ _POST。這很好,除了你的表單需要一個動作,並且該動作默認會強制加載頁面,即使你將它發佈到自己。因此,在實踐中,如果您確實上傳了傳統方式,則不會有模式對話框。
你可能要找的是做文件上傳的「Ajax」方法。這不是真的ajax .....你會做的是上傳到頁面中的「隱藏」iFrame,該頁面便於上傳,看起來沒有重新加載。 Here's a tutorial ......那裏有一百萬人。
還有一些jQuery插件可以使上傳更容易...... Uploadify只是其中之一。
請注意,即使您使用「異步」方法,您仍然受到HTML的限制。有一個上傳按鈕或一個<input type="submit">
將提交您的表單,雖然不正確,使表單看起來像只是失控失控。因此,要解決這個問題,請將您的上傳按鈕設置爲另一個非表單提交元素,例如<a>
或者您只需通過JavaScript調用onclick的圖像。或者,使其成爲一個按鈕,並使用onclick來防止默認的HTML行爲。我通常使用jQuery UI按鈕樣式來做後者。
感謝您花時間閱讀並回復我的文章。鏈接和你的指導是現貨!再次非常感謝和親切的問候。 – IRHM 2012-01-01 17:58:01
爲什麼不試試看lightbox? http://en.wikipedia.org/wiki/Lightbox_(JavaScript)
有各種各樣的lightbox克隆可用,您可以使用帶有上傳器窗體的iframe。看看這裏的比較:http://planetozh.com/projects/lightbox-clones/
嗨,非常感謝您看我的文章。我看過「燈箱」,它看起來是一個偉大的軟件。我遇到的問題是,我需要將主頁面的ID鏈接到爲該特定記錄保存的圖像。而不是試圖解釋,請找到我的網頁的鏈接。 http://www.mapmyfinds.co.uk/development/test.php。正如你可以看到用戶通過頁面工作,然後在底部,他們被問到是否要上傳任何圖像。我使用PHP將圖像保存到一個文件夾,因爲這是我認爲鏈接主要記錄和鏈接圖像的唯一方式。親切的問候 – IRHM 2012-01-01 16:45:57
我認爲你已經找到了解決方案,但你可以鏈接到主頁的ID的權利?如果您使用GET參數打開iframe,則可以將主ID添加到iframe中的上載表單中。 – Tieme 2012-01-02 12:41:53
至於我知道這是非常簡單和較少的JavaScript彈出窗口。這可能會幫助你。 less javascript popup box
描述「各種各樣的問題,因爲我有多個提交按鈕」,因爲jquery模式對話框或另一個jQuery解決方案是要走的路。 – Olaf 2012-01-01 16:35:46
爲什麼彈出窗口/對話框?任何方式嘗試fancybox或燈箱。 – Sawny 2012-01-01 16:37:32
嗨,非常感謝回覆我的帖子。即使在一些成員收到一些優秀的學費後,我也無法在主要表單上提交「提交」操作,即提交完整的表單以獨立於提交我正在上傳的圖像。親切的問候 – IRHM 2012-01-01 16:39:28