jquery 直接在CSS函数中设置三元运算符

Posted 2023-05-13

不想多写一句代码，想直接在CSS中判断IE6设置样式，大概这个意思：
.css(ie6?("width","1px"):("width","2px"))；
求方法。
忘说的，我的CSS样式是不固定的，主要是为了做透明滤镜样式：
.css(ie6?("filter","alpha(opacity=70)"):("opacity","0.7"));

做浏览器验证，可以通过ajax控件检测出IE6，或者使用jQuery提供的一个方法jQuery.support检测特定浏览器属性，你去查一下jquery的API工具一节里的浏览器及特性检测一节，里面有很多方法可以使用
还有我记得如果jQuery的css属性好像是兼容所有浏览器的，譬如opacity，jQuery一旦设置，IE浏览器也是透明的，因为jQuery会自动将其装换成滤镜 参考技术A .css("width", ie6?"1px": "2px")； 参考技术B 那就写下针对ie6 7的hack吧
opacity:0.7;
*filter:alpha(opacity=70);/*ie6, 7认识*/追问

css hack我知道，但是我现在是要写在jquery里。

参考技术C css("width",$.browser.msie&&$.browser.version==6?"50px":"200px");追问

我的ie6已经判断好了，可以直接用：
var ie6=($.browser.msie&&($.browser.version=="6.0")&&!$.support.style);
然后，前面忘记提出来了，我的css样式不是固定的：
比如，如果是Ie6的话，我不会设置width，会直接设置height：
.css(ie6?("filter","alpha(opacity=70)"):("opacity","0.7"))；

在重复的 jQuery / Ajax 函数中设置延迟

【中文标题】在重复的 jQuery / Ajax 函数中设置延迟

【英文标题】：Set a delay in a repeating jQuery / Ajax function

【发布时间】：2013-09-28 17:37:05

【问题描述】：

我正在尝试为可重复查询添加延迟。

我发现 .delay 不是在这里使用的。相反，我应该使用 setInterval 或 setTimeout。我都试过了，都没有运气。

这是我的代码：

<?php 
include("includes/dbconf.php");

$strSQL = mysql_query("SELECT workerID FROM workers ORDER BY workerID ASC");
while($row = mysql_fetch_assoc($strSQL)) 
?>
<script id="source" language="javascript" type="text/javascript">

  $(setInterval(function ()
  
    $.ajax(                                      
      cache: false,
      url: 'ajax2.php',        
      data: "workerID=<?=$row['workerID'];?>",
      dataType: 'json',    
      success: function(data)
      
        var id = data[0];              //get id
        var vname = data[1];           //get name
        //--------------------------------------------------------------------
        // 3) Update html content
        //--------------------------------------------------------------------
        $('#output').html("<b>id: </b>"+id+"<b> name: </b>"+vname);
       
    );
  ),800); 

  </script>
<?php

?>
<div id="output"></div>

代码工作正常，它按要求输出结果。它只是加载没有延迟。超时和/或间隔似乎不起作用。

有人知道我做错了什么吗？

【问题讨论】：

您只设置了 0.8 秒的延迟。这似乎几乎是瞬间的

developer.mozilla.org/en-US/docs/Web/API/window.setInterval "延迟是毫秒数（千分之一秒）"

【参考方案1】：

我一直不明白为什么人们总是间歇性地添加他们的 AJAX 请求，而不是让成功的 AJAX 调用自己调用自己，同时冒着通过多个请求导致严重的服务器负载的风险，而不是在成功调用后才再次调用回来吧。

因此，我喜欢编写 AJAX 调用在完成时调用自己的解决方案，例如：

// set your delay here, 2 seconds as an example...
var my_delay = 2000;

// call your ajax function when the document is ready...
$(function() 
    callAjax();
);

// function that processes your ajax calls...
function callAjax() 
    $.ajax(
        // ajax parameters here...
        // ...
        success: function() 
            setTimeout(callAjax, my_delay);
        
    );

我希望这是有道理的！ :)

更新：

再次查看此问题后，我注意到原始问题中的 PHP 代码中也存在问题，我需要澄清和解决。

虽然上面的脚本可以很好地创建 AJAX 调用之间的延迟，但是当添加到原始帖子中的 PHP 代码中时，该脚本将只是echo'd 输出的次数与 SQL 查询的行数一样多选择，创建多个具有相同名称的函数，并可能同时进行所有 AJAX 调用...一点也不酷...

考虑到这一点，我提出了以下附加解决方案 - 使用 PHP 脚本创建一个 array，该脚本可能会被 JavaScript 一次消化一个元素，以实现所需的结果。一、PHP构建JavaScript数组字符串...

<?php 
    include("includes/configuratie.php");
    $strSQL = mysql_query("SELECT workerID FROM tWorkers ORDER BY workerID ASC");

    // build the array for the JavaScript, needs to be a string...
    $javascript_array = '[';
    $delimiter = '';
    while($row = mysql_fetch_assoc($strSQL))
    
        $javascript_array .= $delimiter . '"'. $row['workerID'] .'"'; // with quotes
        $delimiter = ',';
    
    $javascript_array .= ']';
    // should create an array string, something like:
    // ["1","2","3"]
?>

接下来，JavaScript 来消化和处理我们刚刚创建的数组...

// set your delay here, 2 seconds as an example...
var my_delay = 2000;

// add your JavaScript array here too...
var my_row_ids = <?php echo $javascript_array; ?>;

// call your ajax function when the document is ready...
$(function() 
    callAjax();
);

// function that processes your ajax calls...
function callAjax() 
    // check to see if there are id's remaining...
    if (my_row_ids.length > 0)
    
        // get the next id, and remove it from the array...
        var next_id = my_row_ids[0];
        my_row_ids.shift();
        $.ajax(
            cache    : false,
            url      : 'ajax2.php',
            data     : "workerID=" + next_id, // next ID here!
            dataType : 'json',
            success  : function(data) 
                           // do necessary things here...
                           // call your AJAX function again, with delay...
                           setTimeout(callAjax, my_delay);
                       
        );
    

【讨论】：

你知道吗？我比我的答案更喜欢这个。 +1

谢谢@gibberish，我把它归咎于多年的 jQuery 和 JavaScript 围攻 ;)

你知道我正要输入“这种递归最终不会失控吗？”但后来我开始更深入地研究它，虽然有一个限制，但它似乎相当易于管理：***.com/a/7828803/16959

在 COMPLETE 块中使用这种方法也不错。

【参考方案2】：

注意：Chris Kempen 的答案（上图）更好。请使用那个。他在 AJAX 例程中使用this technique。请参阅this answer，了解为什么使用 setTimeout 优于 setInterval。

---

//Global var
is_expired = 0;

$(function ()

    var timer = setInterval(doAjax, 800);

    //At some point in future, you may wish to stop this repeating command, thus:
    if (is_expired > 0) 
        clearInterval(timer);
    

); //END document.ready

function doAjax() 
    $.ajax(                                      
        cache: false,
        url: 'ajax2.php',        
        data: "workerID=<?=$row['workerID'];?>",
        dataType: 'json',    
        success: function(data) 
            var id = data[0];              //get id
            var vname = data[1];           //get name
            //--------------------------------------------------------------------
            // 3) Update html content
            //--------------------------------------------------------------------
            $('#output').html("<b>id: </b>"+id+"<b> name: </b>"+vname);
        
    ); //END ajax code block
 //END fn doAjax()

【参考方案3】：

我设计了a a wrapper method，它为默认的$.ajax 方法添加了自定义延迟on-top。这是一种在整个应用程序中（在 all jQuery ajax 调用上）延迟的方法。

在模拟现实生活中的随机延迟方面非常方便。

(function()
  $._ajaxDelayBk = $.ajax; // save reference to the "real" ajax method

 // override the method with a wrapper
  $.ajax = function()
    var def = new $.Deferred(),
        delay = typeof $.ajax.delay == 'undefined' ? 500 : $.ajax.delay, 
        delayTimeout,
        args = arguments[0];

    // set simulated delay (random) duration
    delayTimeout = setTimeout(function()
      $._ajaxDelayBk(args)
        .always(def.resolve)
        .done(def.resolve)
        .fail(def.reject)
    , delay);

    def.abort = function()
        clearTimeout(delayTimeout);
    ;

    return def;
  
)();

使用示例：

// optional: set a random delay to all `ajax` calls (between 1s-5s)
$.ajax.delay = Math.floor(Math.random() * 5000) + 1000;

var myAjax = $.ajax(url:'http://whatever.com/API/1', timeout:5000)
  .done(function() console.log('done', arguments) )
  .fail(function() console.log('fail', arguments) )
  .always(function() console.log('always', arguments) )

// Can abort the ajax call
// myAjax.abort();