时间戳

首页 > 解决方案 > Javascript三元运算符不起作用

javascript - Javascript三元运算符不起作用

问题描述

http://jsfiddle.net/xpvt214o/333878/

let maxValues = jQuery('#slider').map(function(){
  return this.max;
}).get();
let maxbudget = maxValues.join();
jQuery(document).on('input', '#slider', function() {
  // On récupère la valeur maximal de l'input range
  let value = jQuery(this).val();
  console.log(value);
  // si on utilise la valeur maximale du budget  alors on affiche en plus 'budget de xx€ et au-delà'

  jQuery(this).val() === maxValues.join() ? jQuery('#slider_value').html( jQuery(this).val() + ' € et au-delà') : '';
  jQuery(this).val() < maxValues.join() ? jQuery('#slider_value').text(  jQuery(this).val() + ' €') : '';

  // if ( jQuery(this).val() === maxValues.join()) {
  //   jQuery('#slider_value').html( jQuery(this).val() + ' € et au dela');
  // }
  // else{
  //   jQuery('#slider_value').html( jQuery(this).val() + ' €');
  // }
});

3-10k 不适用于三元，但如果/其他工作完美，我的三元运算符有什么问题？

标签： javascriptjquery

解决方案

按照您的编码方式，如果条件为假，则该语句将生成一个独立的空字符串 ( '')。由于该字符串没有分配给任何东西，也没有传递给任何方法，因此它对任何东西都没有任何影响，就像您编写了这样的代码一样：

'';

（这是有效的代码，这可能令人惊讶。）

我猜你想''用作传递给htmland的值text。如果是这样，您想将条件运算符¹放在参数中：

jQuery('#slider_value').html( jQuery(this).val() === maxValues.join() ? jQuery(this).val() + ' € et au-delà' : '');
jQuery('#slider_value').text( jQuery(this).val()  <  maxValues.join() ? jQuery(this).val() + ' €'            : '');

边注：

做jQuery(this).val() 一次并将结果存储在一个变量中可能是一个好主意，主要是为了清楚起见，但也因为jQuery(this).val()在幕后做了几个函数调用等：

var value = jQuery(this).val();
jQuery('#slider_value').html( value === maxValues.join() ? value + ' € et au-delà' : '');
jQuery('#slider_value').text( value  <  maxValues.join() ? value + ' €'            : '');

事实上，在现代浏览器上，甚至可以用元素jQuery(this).val()编写。this.valueselect

¹ 运算符的正确名称? :是“条件运算符”。它是一个三元运算符（接受三个操作数的运算符），它是目前 JavaScript 唯一的三元运算符，但谁知道呢，也许有一天会添加另一个......

推荐阅读