從輸入切換下一個div

這可能嗎？

伊夫tryed

<script type="text/javascript"> 
function spoiler() { 
    $(this).next().show(); 
} 
</script> 

<div> 
     <input value="Show/Hide" style="" onclick="spoiler();" type="button"/> 
</div> 
<div style="display:none;"> 
    Text 
</div>

我不能使用類或ID

來源

2012-11-14 Zuker

你的代碼是不工作，因爲$(this)沒有引用您的按鈕。另外，.next()查找按鈕後面的元素，該元素不存在。您正在尋找該按鈕的父級之後的元素。

此外，而不是結合使用onclick的情況下，只用JavaScript綁定它完全：

$(document).ready(function() { 
    $('input[value="Show/Hide"]').click(function() { 
     $(this).parent().next('div').toggle(); 
    }); 
});

然後，您可以簡化您的HTML：

<div> 
    <input value="Show/Hide" type="button" /> 
</div> 

<div style="display:none;"> 
    Text 
</div>

演示：http://jsfiddle.net/NXM7w/

來源

2012-11-14 00:17:39 Blender

攪拌機，我明白了你的觀點，並且它很有效。這是一個論壇，在同一頁面有很多這樣的例子，所以他們將被同時觸發所有這一切，這是不可能的... – Zuker

你是什麼意思？此代碼適用於任何數量的這些元素，無需任何修改。 – Blender

沒事，我錯了！謝謝！ – Zuker

這給一個鏡頭：

$(this).parent().next().show();

來源

2012-11-14 00:16:17 brimil01

你需要使用：

$(this).parent().next().show();

您已經在<div />之內，因此您需要在樹的一個地方遍歷。

來源

2012-11-14 00:16:21

如果您知道DOM中的確切位置，您可以執行類似$('div:nth-child(2)')的操作來選擇元素，但這會非常脆弱 - 對標記的更改可能會破壞您的腳本。

來源

2012-11-14 00:16:42

因爲下一個（）被引用在div的下一個元素，而不是下一個父DIV

使用父（）。下一個（）。節目（）

來源

2012-11-14 00:16:43

您正在引用全局變量'this'，您目前如何使用它。讓你的DIV過程本身，然後你可以從那裏工作很容易：

<div> 
     <input value="Show/Hide" style="" onclick="spoiler(this)" type="button"/> 
</div> 
<div style="display:none;"> 
    Text 
</div>

那麼你的JS函數可以是這樣的：

function spoiler(div1) { 
    $(div1).parent().next().toggle(); 
}

希望這會爲你。

來源

2012-11-14 00:31:21 Sabe

從輸入切換下一個div

回答

相關問題