запустить JavaScript для каждого дочернего элемента в DIV

Я хочу OT сделать новую функцию function showdiv(toshow) «toshow» должен иметь имя DIV, чтобы показать «Div1» или «div2» , а затем я хочу, чтобы внутренний дивы внутри contentdiv и проверить, для каждого DIV, если name is == toshow запуститезапустить JavaScript для каждого дочернего элемента в DIV

$(document.getElementById($div).show("fast");

иначе, если идентификатор DIV! = toshow

$(document.getElementById(@div)).hide("fast");

как написать функцию и для взгляда

Пожалуйста, напишите его в основном и читаемом коде.

function showdiv(toshow) { 
 
} 
 

 
<!-- begin snippet: js hide: false console: true babel: false -->

<!doctype html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <title>hide demo</title> 
 
    <script src="https://code.jquery.com/jquery-1.10.2.js"></script> 
 
</head> 
 
<body> 
 
<a href="#" onclick="showdiv('div1');">Klicka här för div1</a></br> 
 
<a href="#" onclick="showdiv('div2');">Klicka här för div2</a> 
 
<button id="div1show">show div1</button> 
 
<button id="div2show">Show div2</button> 
 
<div id="contentdiv" > 
 
    <div id="div1" name="div1" class="inner" style="display:none;" background: "red"> 
 
     <span>Once</span> <span>upon</span> <span>a</span> 
 
     <span>time</span> <span>there</span> <span>were</span> 
 
     <span>three</span> <span>programmers...</span> 
 
    </div> 
 

 
    <div id="div2" name="div2" class="inner" style="display:none;" background: "blue"> 
 
     <div id="login"> 
 
      <button id="btn">btn</button> 
 
     </div> 
 
     <p>text ... text</p> 
 
    </div> 
 
</div> 
 
<script> 
 
    
 
function showdiv(toshow){ 
 
    $("#contentdiv div").hide("fast"); //Hide all divs 
 
    $("#" + toshow).show("fast"); //Show one specific div 
 
}  
 
    
 

 
$("#div2show").click(function() { 
 
    $(document.getElementById("div1")).hide("fast"); 
 
    $(document.getElementById("div2")).show("fast"); 
 
}); 
 

 
$("#div1show").click(function() { 
 
    $(document.getElementById("div2")).hide("fast"); 
 
    $(document.getElementById("div1")).show("fast"); 
 
}); 
 
</script> 
 
    
 
</body> 
 
</html>

$("#div2show").click(function() { 
    $(document.getElementById("div1")).hide("fast"); 
    $(document.getElementById("div2")).show("fast"); 
}); 

$("#div1show").click(function() { 
    $(document.getElementById("div2")).hide("fast"); 
    $(document.getElementById("div1")).show("fast"); 
});

<a href="#" onclick="$('.content').load('selectlandfromdb.php');">Klicka här</a> 
<button id="div1show">show div1</button> 
<button id="div2show">Show div2</button> 
<div id="contentdiv"> 
    <div id="div1" class="inner" style="`enter code here`display:none;" background: "red"> 
    <span>Once</span> <span>upon</span> <span>a</span> 
    <span>time</span> <span>there</span> <span>were</span> 
    <span>three</span> <span>programmers...</span> 
    </div> 

    <div id="div2" class="inner" style="display:none;" background: "blue"> 
    <p>text ... text</p> 
    </div> 
</div>

источник

2017-01-05 Harald

Я должен сказать, что я видел это для первый раз: '$ (document.getElementById (" div1 "))'. Также ваш вопрос не ясен. – Rajesh

Это довольно трудно понять, что вы хотите достичь, но я предполагаю, что вы хотите, чтобы иметь возможность указать имя DIV, показать этот div и скрыть всех остальных.

Это можно сделать так:

function showdiv(toshow){ 
    $("#contentdiv > div").hide("fast"); //Hide all divs 
    $("#" + toshow).show("fast"); //Show one specific div 
}

Затем вы можете запустить функцию вроде этого:

Кроме того, вам не нужно писать:

$(document.getElementById("div1"));

Чтобы получить элемент jquery по id, вам просто нужно указать, что вы выбираете элемент по его идентификатору, написав # перед именем. Делайте это так:

$("#div1")

источник

2017-01-05 11:53:43 Doozerman

Чтобы уточнить для OP, это простой javascript: 'document.getElementById ('div1')', и это эквивалент jQuery: '$ ('# div1')' – Rounin

thnans, но проблема при добавлении новых div внутри div1 и div2 – Harald

@Harald Что касается проблемы с добавлением divs в div1 и div2, не могли бы вы описать, в чем проблема в точности? Если это факт, что он спрятал все div, даже те, что были внутри других div, тогда это плохо. Не считал это. В моем посте я обновил свою функцию, и она должна работать прямо сейчас. Проблема заключалась в том, что я все divs, используя '$ (" # contentdiv div ")'. Используя '$ (" # contentdiv> div ")' Теперь я выбираю только прямые дочерние элементы '# contentdiv'. – Doozerman

Учитывая вы используете JQuery, вы можете написать что-то вроде этого:

$("#contentdiv>div").each(function(e) { 
    if ($(e).attr("name") == "toShow") $(e).show("fast"); 
    else $(e).hide("fast"); 
})

Примечание: Код не тестируется

источник

2017-01-05 12:00:55

запустить JavaScript для каждого дочернего элемента в DIV

ответ

Смежные вопросы