問題描述

我在一個網(wǎng)站上創(chuàng)建了一個表單，允許用戶上傳文件.用戶還可以將文件拖放到此表單上.但是，在某些設備上，根本無法拖放文件(例如在我的 iPhone 上).所以我只想顯示文本Drag and drop files here".僅在有意義的設備上使用.

I created a form on a website that allows users to upload files. Users can also drag and drop files onto this form. However, on some devices, it is simply not possible to drag and drop files (e.g. on my iPhone). So I only want to display the text "Drag and drop files here" only on devices on which it makes sense.

有沒有辦法檢測設備原則上是否支持拖放文件?一種解決方法可能是檢測鼠標指針是否正在移動.在這種情況下，我猜想可以拖放文件.不過，這只是猜測.

Is there a way to detect whether the device supports drag and drop files in principle? A workaround could be to detect if a mouse pointer is moving. In this case, I would guess it is possible to drag and drop files. However, it would only be a guess.

有沒有更合適的方法來檢測這個?請注意，我一般不想檢測瀏覽器是否支持拖放，而是瀏覽器是否支持拖放文件.

Is there a more suitable way to detect this? Please note that I don't want to detect if the browser supports drag and drop in general, but if the browser supports drag and drop files.

推薦答案

您可以使用 window.navigator.userAgent 來檢測用戶正在使用的操作系統(tǒng).userAgent 返回一個字符串，您可以解析該字符串以嘗試檢測其中的某些關鍵字.我在 geeks for geeks.除了這個 stackoverflow 答案 這里.通過將兩者結(jié)合起來，您應該能夠挑選出某些關鍵字并在大多數(shù)情況下檢測用戶正在使用的內(nèi)容.似乎較舊的手機可能存在此問題，因此可能并不完美.

You could use window.navigator.userAgent in order to detect what OS the user is using. userAgent returns a string and you could parse through the string to try and detect certain keywords inside of it. I looked at this article at geeks for geeks. Along with this stackoverflow answer here. by combining the two you should be able to pick out certain keywords and detect what the user is on for most cases. It seems that older phones might have an issue with this so it may not be perfect.

if (navigator.appVersion.indexOf("Mac") != -1) {
  onWeb = true;
} 
if (navigator.appVersion.indexOf("Win") != -1) {
  onWeb = true;
} else {
onWeb = false;
}

在我個人看來(請對此持保留態(tài)度)與舊設備上的潛在錯誤相關的工作量不值得所涉及的工作.正因為如此，我會嘗試使用文本來告知用戶拖放潛力，并為他們提供上傳文件的按鈕.一些用戶更喜歡通過拖放(我自己)手動上傳文件的能力，并且通過使這兩個選項都可用，它允許用戶使用他們最喜歡的任何選擇.

In my personal opinion (please take this with a grain of salt) the amount of work involved in this with the potential errors on older devices isn't worth the work involved. Because of this I would try to use text to inform the user of the Drag and Drop potential as well as giving them a button to upload files. Some users prefer the ability to manually upload files over a drag and drop (myself), and by having both options readily available it allows users to utilize which ever choice they prefer most.

這篇關于JavaScript中有沒有辦法檢測文件是否可以放在使用的設備上?的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網(wǎng)！