相关疑难解决方法(0)

背景

从jQuery 1.9开始,该.attr(..)方法不再返回属性值,而是我们现在必须使用.prop(..).不幸的是,这也适用于通过属性选择器指定的属性$("input[value=]")

见 http://jquery.com/upgrade-guide/1.9/#attr-versus-prop-

和之间的差异的好,所以讨论.attr和.prop:

.prop()vs .attr()

我的情况

我目前正在使用选择器,$("input[value=]")以及$("select[value=]") 选择没有值集的输入元素.但是,这不再适用于jQuery 1.9,而是我现在正在做这样的事情:

var hasValue = function () { return !!($(this).val().length); };
var hasNoValue = function () { return !($(this).val().length); };
$("input").filter(hasValue);
$("select").filter(hasValue);

我的实际选择器有点大,检查有或没有值的多个元素,所以现在我不得不将我的1选择器字符串拆分成多个选择器,中间使用.filter(..)方法调用.

题

是否有一个相当于$("[value=]"),$("[value!=]"),$("[value='abc']")它使用属性,而不是属性的？如果没有,有没有比使用.filter(hasValue)和.filter(hasNoValue)方法更清洁的方法？

谢谢

我正在生成HTML输入checked="false",但是复选框显示为已选中.

我在javascript控制台中执行了以下操作,但无法弄清楚最新情况.使用.prop()将值设置为false 后生成的HTML 看起来相同,除非现在未在表单上选中复选框.

> $(':input[checked]').prop('checked');
< true
> $(':input[checked]')
< [
<input type=?"checkbox" class=?"caseVal" checked=?"false">?
]
> $(':input[checked]').prop('checked',false);
< [
<input type=?"checkbox" class=?"caseVal" checked=?"false">?
]

我的印象是我应该设置checked="checked"或不包括已检查的属性,如果它的错误是最佳做法？无论哪种方式,我都想知道上面代码中发生了什么.

在IE7中追加时有没有办法检查单选按钮？

什么似乎在每个浏览器中都有效,看起来不像它在IE6,7中工作,尽管到处读到我正在做的正确.我完全不知道为什么它不起作用.

var $itemVariantRowRadio = $("<input/>")
    .attr("type", "radio")
    .attr("name", "itemvariant")
    .addClass("itemvariant")
    .val('whatever');


    $itemVariantRowRadio.attr('checked', 'checked');
    $itemVariantRow.append($itemVariantRowRadio)

现在,如果我console.log($itemVariantRowRadio.attr('checked')在IE6/7中进行操作,那么它会将其设置为TRUE,但实际上收音机不会被检查或选中.

恶梦!其他人遇到过这种情况并有任何修复方法吗？

我们正在开发一个嵌入第三方网站的代码片段,并使用jQuery.

该片段检查该站点是否已加载jQuery.如果是这样,它使用该库,否则它加载我们自己的副本(目前jQuery 1.4.4,我们很快就会迁移到最新版本).

jQuery中有重大变化.一个这样的改变,例如是在语义变化的attr(),和介绍的prop().

是否有一些指导方式以尽可能向后兼容的方式使用jQuery？即使我们迁移到最新版本,我们仍然希望使用现有的jQuery库(如果它存在而不是加载新副本),以节省加载时间和资源.

我有一个启用或禁用select元素的复选框

实际上我使用这段简单的代码就行了.

$("#filtri").change(function(){
    if ($("#menuContinenti").attr("disabled")) {
        $("#menuContinenti").removeAttr("disabled");
    } else {
        $("#menuContinenti").attr("disabled", "disabled");
    }
});

这是最好的方式还是有类似.toggle()功能在禁用/启用之间切换？

我有的html结构是这样的:

<ul id="something">
  <li>
    <a href="">
      <img src="http://domain.com/directory/file1-128x79.jpg">
    </a>
  </li>
  <li>
    <a href="">
      <img src="http://domain.com/directory/file2-128x79.jpg">
    </a>
  </li>
  <li>
    <a href="">
      <img src="http://domain.com/directory/file3-128x79.jpg">
    </a>
  </li>
</ul>

我正在尝试将文件名从文件#-128x79.jpg更改为文件#-896x277.jpg.

我不知道如何获取动态生成的文件名并搜索和替换src更改.

我找到了用'none'替换整个src的方法,以确保我到目前为止做到了,但我不知道如何做其余的事情.

$('#something').removeAttr('id').prop('class', 'some-class').find('img').prop('src', 'none');

似乎jQuery 1.7.2没有为我更新DOM数据属性.鉴于以下标记:

<ul id="foo">
    <li data-my-key="12345">ABCDEF</li>
</ul>

运行下面的JavaScript,我得到一些我不期望的结果:

$('#foo li:first').data('my-key') // Returns 12345 - Expected
$('#foo li[data-my-key="12345"]') // Returns the expected <li>
$('#foo li:first').data('my-key', '54321')
$('#foo li:first').data('my-key') // Returns 54321 - Expected
$('#foo li[data-my-key="54321"]') // Returns an empty array - Not expected

经过进一步调查,我注意到在使用.data()函数设置新值后未对DOM 进行修改(在Chrome 21.0.1180.81,Firebug 1.10.3和Firefox 14.0.1中使用"Inspect Element"验证).

从我的角度来看,这种行为是出乎意料的,但这是否是jQuery数据运行的预期方式？如果是这样,使用jQuery更新data-*属性的适当方法是什么？只需使用attr()函数？

单选按钮仅在页面刷新时取消选中

<input type="radio" name="test">
    1<input type="radio" name="test">2
   <input type="button" id="btn" />

$("#btn").click(function(){

$(':radio').each(function () {
        $(this).removeAttr('checked');
        $('input[type="radio"]').attr('checked', false);
    })

}); 

我创造了一个小提琴 http://jsfiddle.net/8jKJc/220/

但它不能与Bootstrap一起使用

我有以下html:

<div class="copy_me_text">
    <div>
        <input type="text" name="name" />
        <input type="hidden" name="id" />
    </div>
</div>

<div class="copy_me_hidden">
    <div>
        <input type="hidden" name="name" />
        <input type="hidden" name="id" />
    </div>
</div>

并遵循js代码:

var $cloned_text = $('.copy_me_text').clone();
$cloned_text.find('input[name="name"]').val("SOMETHING");
$cloned_text.find('input[name="id"]').val("SOMETHING");
console.log($cloned_text.html());

var $cloned_hidden = $('.copy_me_hidden').clone();
$cloned_hidden.find('input[name="name"]').val("SOMETHING");
$cloned_hidden.find('input[name="id"]').val("SOMETHING");
console.log($cloned_hidden.html());

输出对我来说很奇怪:

<div>
    <input name="name" type="text">
    <input value="SOMETHING" name="id" type="hidden">
</div>
<div>
    <input value="SOMETHING" name="name" type="hidden">
    <input value="SOMETHING" name="id" type="hidden">
</div>

我也创建了jsFiddle 示例.这是正确的行为吗？我不明白,为什么在.html()功能上,价值input type="text"不归还.

我想检测输入字段中文本/值的变化.所以我读了很多例子并尝试下面的代码.但它不起作用.这是小提琴预览.即使我用js代码改变值我想要检测到这些变化.

HTML

<input type="text" id="exNumber"/>

JavaScript的

var observer = new MutationObserver(function(mutations) {
  mutations.forEach(function(mutation) {
    // console.log('Mutation type: ' + mutation.type);
    if ( mutation.type == 'childList' ) {
      if (mutation.addedNodes.length >= 1) {
        if (mutation.addedNodes[0].nodeName != '#text') {
//        console.log('Added ' + mutation.addedNodes[0].tagName + ' tag.');
        }
      }
      else if (mutation.removedNodes.length >= 1) {
       // console.log('Removed ' + mutation.removedNodes[0].tagName + ' tag.')
      }
    }
     if (mutation.type == 'attributes') {
      console.log('Modified ' + mutation.attributeName + ' attribute.')
    }
        });   
}); …