jQuery Hide/Show 3 блока [требует правки]

228

03 июля 2017, 18:33

Имеется такой код. Думаю суть ясна. Нужно что бы по клику на ссылку открывался определенный из 3 блоков. Как правильно реализовать? Так это не работает.

$( document ).ready(function() {
    $("#addfunds").show();
    $("#moneyhistory").hide();
    $("#cashout").hide();
    $("#open_moneyhistory").click(function(){
        $("#addfunds").hide();
        $("#moneyhistory").show();
        $("#cashout").hide();
        $("#mhload").load('test.php', {userid:1});
    });
    $("#open_cashout").click(function(){
        $("#addfunds").hide();
        $("#moneyhistory").hide();
        $("#cashout").show();
    });
    $("#open_addfunds").click(function(){
        $("#addfunds").show();
        $("#moneyhistory").hide();
        $("#cashout").hide();
    });
});

Answer 1

Просто оформил ваш код в виджет. Все работает.

$(document).ready(function() { 
  $("#addfunds").show(); 
  $("#moneyhistory").hide(); 
  $("#cashout").hide(); 
  $("#open_moneyhistory").click(function() { 
    $("#addfunds").hide(); 
    $("#moneyhistory").show(); 
    $("#cashout").hide(); 
    $("#mhload").load('test.php', { 
      userid: 1 
    }); 
  }); 
  $("#open_cashout").click(function() { 
    $("#addfunds").hide(); 
    $("#moneyhistory").hide(); 
    $("#cashout").show(); 
  }); 
  $("#open_addfunds").click(function() { 
    $("#addfunds").show(); 
    $("#moneyhistory").hide(); 
    $("#cashout").hide(); 
  }); 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<p><a id="open_moneyhistory" href="#">open_moneyhistory</a></p> 
<p><a id="open_cashout" href="#">open_cashout</a> </p> 
<p><a id="open_addfunds" href="#">open_addfunds</a></p> 
 
<div id="addfunds"> 
  #addfunds 
</div> 
<div id="moneyhistory"> 
  #moneyhistory 
</div> 
<div id="cashout"> 
  #cashout 
</div>