cómo vincular el evento de clic de div

Question

<div id="profile_ops" style="display:none"> 
    <button class="ybutton" id="viewclick" >View</button>&nbsp; 
    <button class="ybutton" id="editclick" >Edit</button>&nbsp; 
    <button class="ybutton" id="change_pswd" >Change Password</button>&nbsp; 
    <button class="ybutton" id="change_pic" >Change Picture</button>&nbsp; 
</div> 

en esto muestro este div en condiciones particulares y oculto el botón de vista, pero al hacer clic en editar, muestro el botón de vista, pero quiero dar clic en el botón evento de vista, donde debería dar el evento click de div?

He intentado dar el clic de evento en el clic de edición pero me está dando error?

Answer 1

acaba de asignar el evento de cliente a cada uno

$(document).ready(function() { 

    $("#viewclick").click(function() { 
    // this will fire when you click view 
    }); 
    $("#editclick").click(function() { 
    // this will fire when you click edit 
    // hide the view button here and upon submit, show it again 
    // like $("#viewclick").hide() or $("#viewclick").fadeOut() 
    }); 

}); 

Answer 2

puede vincular el evento click del botón de vista desde el inicio. Incluso si el evento está encuadernado. El usuario no puede iniciar el evento si el botón no se ve/no se ve. por lo tanto, si la vista no está visible, el evento click nunca se dispara. Pero cuando el usuario hace clic en editar, la vista estará visible y el evento ya está encuadernado, por lo que podrá hacer clic y la lógica de clics correspondiente mejorará.

Answer 3

Yo no entendía mucho de lo que ha dicho, pero para añadir un evento de ocultar/mostrar que podría hacer algo como esto:

$('#editclick').toggle(function() { 
    $('#viewclick').css('display', 'none'); 
}, function() { 
    $('#viewclick').css('display', 'inline'); 
}); 

Answer 4

Agregue el código en una etiqueta script.

Esto se puede hacer de diferentes maneras, en primer lugar digamos que su etiqueta script viene antes del elemento:

<script></script> 
<div></div> 

Así que hay que enlazar el evento de clic sólo después de que se preste el elemento, puede hacerlo utilizando :

$("div").live("click", function() {}); 

.live añadirá un manejador de sucesos en la ventana y comprobar si el evento click, entonces se comprueba el objetivo, si coincide con el evento se dispara. De esta forma, cualquier elemento agregado en cualquier momento en el DOM activará este controlador.

Otra forma es usando $(document).ready() ($(function(){}) es un alias). Esta función agrega una función que se ejecutará cuando se cargue la página DOM.

$(function() { 
    // when all elements have been loaded, add event on 'div' 
    $("div").click(function() { }); 
}); 

Si la secuencia de comandos se produce después de que su elemento

<div></div> 
<script></script> 

A continuación, puede utilizar $("div").click, a menos que el contenido del div se cargan dinámicamente.

Referencias

• live
• click
• ready

Answer 5

usted debe poner botón de vista fuera de la div

<button class="ybutton" id="viewclick" onclick="ShowHide();">View</button>&nbsp; 
<div id="profile_ops" style="display:none"> 
          <button class="ybutton" id="editclick" >Edit</button>&nbsp; 
        <button class="ybutton" id="change_pswd" >Change Password</button>&nbsp; 
        <button class="ybutton" id="change_pic" >Change Picture</button>&nbsp; 
       </div> 

al hacer clic en el botón de vista se muestra su div y el botón de vista se oculta, Y cuando vuelve a hacer clic en el botón editar, se vuelve a visualizar el botón.

Answer 6

Puede probar este

$('#element).on('click', 
    function(e){ 
     this.change(); 
    }); 

Answer 7

function ShowHide() { 
    $("#profile_ops").show(); 
    $("#viewclick").hide(); 
} 

$(document).ready(function(){ 
    $("#editclick").click(function(){ 
     $("#viewclick").show(); 

    }); 

}) 


    <button class="ybutton" id="viewclick" onclick="ShowHide();">View</button>&nbsp; 
    <div id="profile_ops" style="display:none"> 
     <button class="ybutton" id="editclick" >Edit</button>&nbsp; 
     <button class="ybutton" id="change_pswd" >Change Password</button>&nbsp; 
     <button class="ybutton" id="change_pic" >Change Picture</button>&nbsp; 
    </div>