Jquery将字符串转换为对象

问题描述：

我有一些代码，我试图将一个div的id值传递给一个函数，该函数然后淡出第一个div然后淡入第二个。我知道该函数接受对象，因为当我试图显示给它的值$ alert（）时，我得到[Object object]。当单击其中一个按钮时，它将尝试查找可见div的id，然后将其传递给fade函数，但它会找到id并将其保存在一个字符串中，我需要将其转换为对象。这里是我的代码：Jquery将字符串转换为对象

<script type="text/javascript"> 
 
$(function() { 
 
    $('#step1').fadeIn("slow"); 
 
    $('#btn1').addClass("btn-primary active"); 
 
    
 
    $('#btn1').click(function() { 
 
    \t var id = $(".editor .steps").filter(function() { //this gets the value of the active div and saves it into id. 
 
\t \t if ($(this).css('display') == 'block') { 
 
\t \t \t return true; 
 
\t \t } 
 
\t }).attr('id'); 
 
\t fade(id, $('#step1')) //tyring to send id and the the step1 to the fade function 
 
    }); 
 
    
 
    $('#btn-step2-video').click(function() { 
 
     fade($('#step1'), $('#step2-video')); 
 
     $('#btn1').addClass("btn-primary"); 
 
     $('#btn2').addClass("btn-primary active"); 
 
    }); 
 

 
    $('#btn-step2-picture').click(function() { 
 
     fade($('#step1'), $('#step2-picture')); 
 
     btn2.addClass("btn-primary active"); 
 
    }); 
 
    
 
    var fade = function(fadeout, fadein){ 
 
    \t $(fadeout).fadeOut("slow"); 
 
     $(fadein).fadeIn("slow"); 
 
    } 
 
}); 
 
</script> 
 

 
Here is the HTML of the page: 
 

 
<!-- begin snippet: js hide: false -->

<div id="steps"> 
 
\t <button id="btn1" type="button" class="btn btn-primary btn-lg btn-step">1</button> 
 
\t <a class="btn-description">Choose type of ad</a> 
 
\t <button id="btn2" type="button" class="btn btn-primary btn-lg btn-step">2</button> 
 
\t <a class="btn">Confirmation &amp; Payment</a> 
 
</div> 
 

 
<!-- 
 
Begining of editor 
 
--> 
 

 
<div class="editor"> 
 

 
<!-- 
 
Step 1 of the editor 
 
--> 
 

 
<div id="step1" class="steps" style="display:none;" > 
 
\t <a id="btn-step2-video" style="position:fixed; top: 45%; left: 25%; cursor:pointer"><div class="btn-ad-choice ad-choice"> 
 
\t \t <br> 
 
\t \t <p><b>Create a video ad:</b></p> 
 
\t \t <video width="200" height="113" autoplay="autoplay" mute> 
 
\t \t \t <source src="video/exemple.mp4" type="video/mp4"> 
 
\t \t \t Your browser does not support the video tag. 
 
\t \t </video> 
 
\t </div></a> 
 
\t 
 
\t <a id="btn-step2-picture" style="position:fixed; top: 45%; right: 25%; cursor:pointer"><div class="btn-ad-choice ad-choice"> 
 
\t \t <br> 
 
\t \t <p><b>Create a picture ad:</b></p> 
 
\t \t <img src="images/adexemple.jpg" alt="Exemple of a picutre ad" height="113" width="200"> 
 
\t </div></a> 
 

 
</div> 
 

 
<!-- 
 
Step 2 for video of the editor 
 
--> 
 

 
<div id="step2-video" class="steps" style="display: none; height:400px; width:100%; background:gray"> 
 
\t video 
 
</div> 
 

 
<!-- 
 
Step 2 for pictures of the editor 
 
--> 
 

 
<div id="step2-picture" class="steps" style="display: none;"> 
 
\t picture 
 
</div> 
 

 
<!-- 
 
end of editor 
 
--> 
 
</div>

编辑

我编辑我的JavaScript来：

$('#btn1').click(function() { 
 
    \t fade($(".editor .steps:visible"), $('#step1')); //tyring to send id and the the step1 to the fade function 
 
    });

的建议：阿伦P约翰尼拉感谢;）

可以共享HTML样本简化它 – 2015-02-23 03:58:37

答

jQuery对象接受一个选择为好，所以我可以看到的唯一问题是你没有使用id selector，要传递的ID，并用它作为一个element selector所以

fade('#'+id, $('#step1'))

应该工作。

但是你可以通过使用visible selector到

$('#btn1').click(function() { 
    fade($(".editor .steps:visible"), $('#step1')) //tyring to send id and the the step1 to the fade function 
});

Jquery将字符串转换为对象

相关推荐