Javascript 选择的插件在移动浏览器上似乎不起作用

我已经为用户设置了一个选择字段，以便用户能够从一个长列表中键入搜索

虽然我正在为手机开发这款软件，虽然它在电脑上运行良好，但在苹果和安卓手机上都被禁用，默认用户界面会弹出供选择输入

---

我想在手机上使用该插件。

在使用任何插件之前，请检查其范围

在android或IOS上不支持Selected，在iPhone、iPod Touch和android移动设备上禁用Selected

Choosed.jquery.js中支持函数浏览器_，这说明它有意避免在Android和iPhone平台上激活。但是你可以自己解决

 AbstractChosen.browser_is_supported = function() {
  if (window.navigator.appName === "Microsoft Internet Explorer") {
    return document.documentMode >= 8;
  }
  if (/iP(od|hone)/i.test(window.navigator.userAgent)) {
    return false;
  }
  if (/Android/i.test(window.navigator.userAgent)) {
    if (/Mobile/i.test(window.navigator.userAgent)) {
      return false;
    }
  }
  return true;
};

AbstractSelected.browser_受支持的功能不允许您在移动设备和internet explorer上使用此插件，因此您可以自己破解此插件

 AbstractChosen.browser_is_supported = function() {
  if (window.navigator.appName === "Microsoft Internet Explorer") {
    return document.documentMode >= 8;
  }
  if (/iP(od|hone)/i.test(window.navigator.userAgent)) {
    return false;
  }
  if (/Android/i.test(window.navigator.userAgent)) {
    if (/Mobile/i.test(window.navigator.userAgent)) {
      return false;
    }
  }
  return true;
};

在selected.jquery.js中找到以下行，并对代码进行注释。现在选择的插件将在移动设备上工作

if (!AbstractChosen.browser_is_supported()) {
    return this;
}   
if (!AbstractChosen.browser_is_supported()) {
    return;  
}

---

在tablet mobile中禁用

 AbstractChosen.browser_is_supported = function () {
        if (window.navigator.appName === "Microsoft Internet Explorer") {
            return document.documentMode >= 8;
        }
        //if (/iP(od|hone)/i.test(window.navigator.userAgent))
        if ((/iPhone|iPod|iPad|Android|android|playbook|silk|BlackBerry/).test(navigator.userAgent)) 
        {
            return false;
        }
        if (/Android/i.test(window.navigator.userAgent)) {
            if (/Mobile/i.test(window.navigator.userAgent)) {
                return false;
            }
        }
        return true;
    };

---

对我来说是这样的：

        }, AbstractChosen.browser_is_supported = function() {
            return "Microsoft Internet Explorer" === window.navigator.appName ? document.documentMode >= 8 : /iP(od|hone)/i.test(window.navigator.userAgent) ? !1 : /Android/i.test(window.navigator.userAgent) && /Mobile/i.test(window.navigator.userAgent) ? !1 : !0
        }

换成那样，它就像一个符咒

}, AbstractChosen.browser_is_supported = function() {          
return true;
}

---

我在这里发布了一个后备方案，因为我依赖ChosenJS插件来工作，以便可以应用自定义CSS。希望这能帮助其他人

免责声明：@dreamweiver给出的上述答案仍然是公认的答案，因为存在问题

var chosenSelects = $('.ui-select').find('.chosen-select, [chosen]'),
    $select, $option;

if (chosenSelects) {
    chosenSelects.chosen();

    // Check for 'chosen' elements on mobile devices
    // -----
    // Given that ChosenJS has expressly been disabled from running
    // on mobile browsers, the styles have to be applied manually.
    // Source: https://github.com/harvesthq/chosen/pull/1388
    // -----
    // The code below gathers all 'chosen' selectors and adds
    // 'chosen-mobile' as a className. This className is then
    // used to apply the necessary styles for mobile browsers.
    // Within each select, if an 'option' has an empty value,
    // then that value will be given 'selected' and 'disabled'
    // attributes to act as a placeholder, adopting the text
    // in the 'data-placeholder' as the text to be displayed.
    if ( /iP(od|hone)/i.test(window.navigator.userAgent)
        || (/Android/i.test(window.navigator.userAgent) && /Mobile/i.test(window.navigator.userAgent)) ) {
        chosenSelects.each(function () {
            $select = $(this);
            $select.addClass('chosen-mobile');

            $select.find('option').each(function () {
                $option = $(this);

                if ( $option.val() == '' ) {
                    $option
                        .attr('selected', 'selected')
                        .attr('disabled', 'disabled')
                        .text( $select.data('placeholder') );
                }
            });
        });
    }
}

---

这样，我就可以使用.ui select.selected mobile应用所需的CSS。

根据github上的说明，它不支持移动设备。你应该向开发人员了解这一点，并了解他们的计划是什么/自己开发移动设备。在移动设备上，与元素的交互是如此的不同，以至于想要实现这一点都没有意义。如果这个问题仍然有效，请尝试选择这个分叉，这在手机上有效-尝试在手机上有效如果您明确请求网站的桌面版本，它在Safari的iOS8上有效。证据：显然，iOS8上的新Safari具有运行它的功能。请求该站点的桌面版本所做的只是更改Mozilla/5.0 iPhone中的useragent字符串；CPU iPhone OS 8_0_2，如Mac OS X AppleWebKit/600.1.4 KHTML，如Gecko Version/8.0 Mobile/12A405 Safari/600.1.4至Mozilla/5.0 Macintosh；Intel Mac OS X 10_10 AppleWebKit/538.44 KHTML，就像Gecko Version/8.0 Safari/538.44一样，它似乎绕过了Selected禁用的浏览器检测@techouse:hmm。在这种情况下，它可能会在以后的阶段引发一些未知问题，因为它没有在Selected plugin:D中处理。总之，捕获得不错。是一种在mobilewell上工作的替代方案，它可能在入门级解决问题，因为即使您试图绕过所选库的兼容性检查，所选库的某些功能也可能无法在这些浏览器上工作。永远不要试图改变图书馆的行为，除非你100%确定你在做什么。非常感谢！！！！！回答得真好！伟大的成功了！非常感谢。非常感谢你的帮助。非常感谢。这确实有效，但它让我在选择上点击2次以显示它。。第一次打开和关闭+打开键盘，第二次全部工作。有什么解决方案可以让它在第一次点击时工作吗？这个答案对我来说很好。在你更改这个文件后，你如何承诺生产？