小编L84*_*L84的帖子

我有一个标有下划线的标题text-decoration: underline;唯一的问题是该行太薄了.我想只做下划线更粗.我考虑border-bottom过这样做,但是边框会拉伸容器的整个宽度,文本会居中.不行.

我有一个带有多个复选框的表单。我在表单中有三类复选框。我需要限制每个类别最多三个复选框。

我使用了这个脚本，但它限制为每个表单三个复选框。

jQuery(function(){
   var max = 3;
   var checkboxes = jQuery('input[type="checkbox"]');

   checkboxes.change(function(){
      var current = checkboxes.filter(':checked').length;
       checkboxes.filter(':not(:checked)').prop('disabled', current >= max);
   });
});

如何修改上述脚本以在一个表单中限制每个类别的三个复选框？

HTML 示例：

<!-- FORM CODE --> 

<!-- Start Categories -->

<label>Cat 1</label>
  <!-- Checkboxes for Cat 1 - Max of Three in Category -->
  <input type="checkbox" value="Option 1" id="CAT_Custom_365571_0" name="CAT_Custom_365571" />Creative<br />
  <input type="checkbox" value="Option 2" id="CAT_Custom_365571_1" name="CAT_Custom_365571" />Euphoric<br />
  <input type="checkbox" value="Option 3" id="CAT_Custom_365571_2" name="CAT_Custom_365571" />Uplifted<br />
  <!-- More checkboxes -->
<label>Cat 2</label>
  <!-- …

我有多个动态添加的单选按钮.我想将所选单选按钮的值属性更改为,"yes"并在"no"选择了其他单选按钮后将单选按钮值更改为.

<input type="radio" name="tab-active" value="no" />

我可以"yes"通过使用以下jQuery 获取要更改的值:

$(document).on("click","input[name=tab-active]:radio",function(){
    if($("input:radio[name=tab-active]").is(":checked")) {
        $(this).val('yes');
    }
});

如果选择"no"了其他单选按钮,如何更改所选单选按钮的值属性？

我在网站上有一个多步骤的网络表单.当一个人点击下一个时,div会逐渐消失,因为div二渐渐淡入.我看到的问题是当div一个淡出div二衰落在div一个下面然后跳跃一旦div一个淡出.

我如何防止这种情况并让它们实际交叉淡入淡出？

HTML

<div class="step-1"> 
  <!-- CODE -->
</div >

<div class="step-2"> 
  <!-- THIS DIV IS HIDDEN TO BEGIN WITH -->
</div >

JS

$( ".step-1-next" ).on( "click", function() {
    $( ".step-1" ).fadeOut( "slow" );
    $( ".step-2" ).fadeIn( "slow" );
    return false;
});

我见过一些网页,包括页面之间很好的过渡,比如滑动或褪色等等.我看到的其中大多数实际上是一个只转换各个部分的页面.然后我遇到了一个不同的网站.

如果您查看此站点并单击各个页面,页面将平滑过渡,但URL不同,并且它似乎不是具有隐藏部分的一个页面站点.

这是怎么做到的？我寻找解释如何做到这一点,但从未找到一个好的答案.确定如何做到这一点的任何帮助都会很棒.

注意:我希望为我构建的网站复制此功能,因此我正在寻找一个解释如何编码的想法或过程的答案.

我有看起来像这样的代码：

<ul id="effects-list" class="effects-list">
    <li data-creative="5">Creative</li>
</ul>

我正在尝试使用以下代码读取以上HTML的数据属性：

var effectData = document.getElementById("effects-list").getElementsByTagName("li");
var creative = effectData.getAttribute('data-creative');
alert(creative)

上面的代码不起作用。它引发以下错误：

effectData.getAttribute is not a function

我在页面上使用jQuery，最初尝试过此操作：

var effectData = $('.effects-list li');

同样，同样的错误。

我有什么问题，如何解决？

这是代码的jsFiddle。

注意：li页面上有更多元素，而我正在读取的数据不仅仅是一个li元素。li如果可以，我会尽量避免在每个元素上添加单独的ID 。

我看了一下,但只能找到JS解决方案.

有没有办法用CSS来检测输入是否输入了任何文本？

我正在做的基本上就是这个(删除这个问题的无关代码):

 .search-form input[type="text"] {
    width: 0 !important;
}
.search-form input[type="text"]:focus {
    width: 100% !important;
}

实质上,单击标签会将输入扩展为页面宽度的100%.这工作正常,但是当您输入文本并单击输入时,它会缩小回宽度:0 - 因此隐藏输入的文本.有没有办法用CSS来防止这种行为,并保持它width:100%就像输入是:focus在输入文本时？

我希望使用jQuery contains来遍历页面上的每个图像,并检查src标记是否包含某个http值.如何使用jQuery或javacript对src属性中的文本进行检查.我概述了我在下面尝试的内容:

$('img').each(function(i){
  var img = $(this),
      imgSrc = img.attr('src'),
      siteURL = "http://url.com";

  if(!imgSrc.contains(siteURL)){
     imgSrc = siteURL + imgSrc;
  }
});                         

我有一种感觉正则表达可能是走的路,只是不知道如何肯定.

我有以下标记:

<div id="breadcrumbs">
  <ul>
   <li><span class="crumblink"><a href="/">Home</a></span></li>
   <span class="arrows"> »</span>  
   <li><span class="crumblink"><a href="/locations-brands">Publishing Regions</a></span></li>
   <span class="arrows"> »</span>  
   <li><span class="crumblink"><a href="/locations-brands/publications">Locations &amp; Brands</a></span></li>
   <span class="arrows"> »</span>
   <li><span class="crumblink"><a href="/locations-brands/publications/popupbrand">Publications</a></span></li>
   <span class="arrows"> »</span>  
  </ul>
</div>

如何删除<li>if有字符串"Publications"及其下一个span.arrows？

我试图使用jQuery缓动函数easeInBounce,我看到这个错误:

ReferenceError: easeInBounce is not defined

我正在使用jQuery 1.8,Easing 1.3和jQuery UI 1.8.23.

这是我的代码

HTML:

 <div id="loading">
<h2 class="textcenter">Loading...</h2>
 <img id="loading-image" class="center" src="/images/ajax-loader.gif"  />
</div>
<div id="content-wrap" class="hide">
    <div class="img-center">
    <img style="z-index:10" src="/bird-bg.jpg" />
    </div>
    <img class="hide" id="bird" src="/bird.png" />
</div>

CSS:

#bird{
position:absolute;
left:300px;
top: 0px;
z-index:999;
}

.hide {display: none;}

JS:

var $j = jQuery.noConflict();
   $j(window).load(function() {
        $j('#loading').fadeOut('slow', function() {
  $j("#content-wrap").fadeIn("slow", function() {
      $j("#bird").slideDown({ duration: 1000, easing: easeInBounce});
       });
   });
});