jQuery的切換「變量」的div

我從DB結果頁面，每行我有顯示/隱藏按鈕應該顯示/隱藏容器$標題....jQuery的切換「變量」的div

我試圖用jQuery，但它不會工作:(

<div class="container"> 
<div class="show_hide_button_<? echo $article_id_tmp; ?>"><a href="#">show/hide</a></div> 
    <div class="show_hide_container_<? echo $article_id_tmp; ?>"> 
</div> 
</div> 



<script type="text/javascript"> 
var div_id = '$article_id_tmp'; 

div_id_b+='.show_hide_button_'+ 'div_id'; 
div_id_c+='.show_hide_container_'+ 'div_id'; 

$(function(){ 
    $('div_id_b').click(function(){ 
    $('div_id_c').toggle();  
    }); 
});

謝謝

來源

2011-09-12 InTry

你的變量是變量，而不是字符串，所以你不應該內空格括起來：

var div_id = '$article_id_tmp'; 

div_id_b+='.show_hide_button_'+ 'div_id'; 
div_id_c+='.show_hide_container_'+ 'div_id'; 

$(function(){ 
    $(div_id_b).click(function(){ 
    $(div_id_c).toggle();  
    }); 
});

此外，你需要echo的$article_id_tmp在JS中：

var div_id = '<?php echo $article_id_tmp ?>'; 

div_id_b+='.show_hide_button_'+ 'div_id'; 
div_id_c+='.show_hide_container_'+ 'div_id'; 

$(function(){ 
    $(div_id_b).click(function(){ 
    $(div_id_c).toggle();  
    }); 
});

另外，classes是通常用於在頁面上分組類似的元素;然而你正在爲每個元素分配不同的類。爲了保持一致性，你可能要考慮使用的「ID」，而不是一類，或者更好，類似如下：

<div class="container"> 
    <div class="show_hide_button"><a href="#">show/hide</a></div> 
    <div class="container"> 
    </div> 
</div> 

$('.show_hide_button').click(function() { 
    $(this).next('.container').toggle(); 
});

你當然可以，刪除container類，並只使用$(this).next().toggle()

來源

2011-09-12 12:18:58 Matt

那麼容易，非常感謝你！ – InTry

的JavaScript代碼需要有PHP變量正確輸出，因爲你已經在HTML這樣做，你需要改變：

var div_id = '$article_id_tmp';

到

var div_id = '<?php echo $article_id_tmp; ?>';

這就要求<script>輸出直列在你的問題。 JavaScript不能以單獨文件的形式存在。

而爲@馬特已經回答了，該div_id是一個變量，並串聯起來分配給div_id_b和div_id_c變量時，當不應該被引用。分配應該是：

var div_id_b = '.show_hide_button_' + div_id; 
var div_id_c = '.show_hide_container_' + div_id;

而最後的jQuery選擇不要求報價，因爲他們是變量了。現有代碼將查找元素，調用div_id_b，該元素不存在。

正確的選擇應該是$(div_id_b).click(...)和$(div_id_c).toggle();

來源

2011-09-12 12:18:44 andyb

對我來說，它看起來像你會寫

var div_id = '<?php echo $article_id_tmp; ?>';

，而不是

var div_id = '$article_id_tmp';

這樣，你實際上是喂正確的字符串。否則div_id將永遠是string '$article_id_tmp'

來源

2011-09-12 12:20:47

也許你需要簡化你的標記。使用一些班級標記show/hide按鈕和一些班級給你的content容器。和腳本將是非常小的和可以理解的：

$('.container .show_hide_button a').click(function() { 
    $(this).parent().siblings('.show_hide_container').toggle(); 
});

現場演示：http://jsfiddle.net/gYkKz/4/

來源

2011-09-12 12:22:16 Samich

jQuery的切換「變量」的div

回答

相關問題