代码之家 › 专栏 › 技术社区 › James Santiago

JQuery UI可选停止事件在IE中不起作用

asp.net-mvc-2 jquery-ui html asp.net

0

James Santiago · 技术社区 · 15 年前

我有一个JQuery select组件和一个javascript函数来处理stop事件:

     <script type="text/javascript">
         $("#selectable").selectable({
             stop: function() {
                 $(".ui-selected", this).each(function(i, selected) {
                     if ($(selected).text() == "Google") {
                         $("#openid_identifier").val("https://www.google.com/accounts/o8/id");
                     }
                     else if ($(selected).text() == "Yahoo") {
                         $("#openid_identifier").val("http://yahoo.com/");
                     }
                 });
             }
         });
     </script>

该脚本在firefox和chrome中运行良好,但在IE7/8中不起作用。它通常应该在单击google或yahoo选择框后向openid\标识符文本框发送一个字符串。

有什么办法让它在IE中工作吗?

3 回复 | 直到 15 年前

1

JamesStuddart 15 年前

是的,我又看了一遍代码,我意识到我犯了一点错误哦!

<script type="text/javascript">
    $(function() {
        $("#selectable").selectable({
   stop: function(event, ui) { $(".ui-selected", this).each(function(i, selected) {
                    if($(selected).html().replace(/\s/g, "") == "Google") {
                         alert("https://www.google.com/accounts/o8/id");
                     }
                     else if ($(selected).html().replace(/\s/g, "") == "Yahoo") {
                         alert("http://yahoo.com/");
                     }
                 });
 }
});
    });
    </script>

2

1

JamesStuddart 15 年前

请尝试以下操作:

     <script type="text/javascript">
     $("#selectable").selectable({
         stop: function() {
             $(".ui-selected", this).each(function(i, selected) {
                 if ($(selected).html() == "Google") {
                     $("#openid_identifier").val("https://www.google.com/accounts/o8/id");
                 }
                 else if ($(selected).html() == "Yahoo") {
                     $("#openid_identifier").val("http://yahoo.com/");
                 }
             });
         }
     });
 </script>

当我尝试你的代码时,它对我有用

编辑: 下面是我用来测试的代码

<html>
<head>

<html>
<head>
    <meta charset="UTF-8" />
    <title>make layout</title>
            <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
            <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" 
href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css"/>
<style type="text/css">
   .testdiv { background: silver; float:left;margin:0;padding:0;}
</style>
</head>
<body>  
<style type="text/css">
    #feedback { font-size: 1.4em; }
    #selectable .ui-selecting { background: #FECA40; }
    #selectable .ui-selected { background: #F39814; color: white; }
    #selectable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
    #selectable li { margin: 3px; padding: 0.4em; font-size: 1.4em; height: 18px; }
    </style>
    <script type="text/javascript">
    $(function() {
        $("#selectable").selectable({
   stop: function(event, ui) { $(".ui-selected", this).each(function(i, selected) {
   alert($(selected).html());
                    if($(selected).text() == "Google") {
                         alert("https://www.google.com/accounts/o8/id");
                     }
                     else if ($(selected).text() == "Yahoo") {
                         alert("http://yahoo.com/");
                     }
                 });
 }
});
    });
    </script>


<div class="demo">

<ol id="selectable">
    <li class="ui-widget-content">Google</li>
    <li class="ui-widget-content">Yahoo</li>

</ol>

</div>
</body>
</html>

3

0

James Santiago 15 年前

看起来问题是$(selected).html()在ie7中返回“Google”(带空格),但在ie8、firefox和chrome中返回“Google”。

var chosen = $(selected).html() . 这在IE7中返回了“Google”。为了修复这个神秘的IE7空格字符,我修改了脚本以确保空格不会影响结果:

 <script type="text/javascript">
 $("#selectable").selectable({
     stop: function() {
         $(".ui-selected", this).each(function(i, selected) {
             var chosen = $(selected).html();
             var subSection = chosen.substring(4, 0);
             if (subSection == "Goog") {
                 $("#openid_identifier").val("https://www.google.com/accounts/o8/id");
             }
             else if (subSection == "Yaho") {
                 $("#openid_identifier").val("http://yahoo.com/");
             }
         });
     }
 });