버튼 하나에 따라 두 가지 동작이 형성됩니까?

Question

나는이 두 파일, preview.php & save.php

<form id="create-template" class="form" action="" method="post"> 
    <p class="_50"> 
     <label for="t-name">Template name</label> 
     <input type="text" name="t-name" class="required"/> 
    </p> 
    <p class="_100"> 
     <label for="t-html">Template HTML</label> 
     <textarea id="t-html" name="t-html" class="required" rows="10" cols="40"></textarea> 
    </p> 
    <div class="clear"></div> 

    <div class="block-actions"> 
     <ul class="actions-left"> 
      <li><a class="button red" id="reset-template" href="javascript:void(0);">Clear</a></li> 
     </ul> 
     <ul class="actions-right"> 
      <li><div id="preview"><input type="submit" class="button" value="Preview template" onclick="return false;"></div></li> 
      <li><input type="submit" class="button" value="Create template"></li> 
     </ul> 
    </div> 
</form> 

현재 JS :

나도 같은 양식을 사용하지만 서로 다른 두 가지의 행동이 어떤 버튼을 한번 누름에 따라 가질 수있는 방법

$("#preview").click(function() { 
    $.post('preview.php', {body:$('#t-html').val().replace(/\n/g,'<br />'), function (result) { 
     //maybe use .ajax instead? 
     //open preview.php in new window 
    }); 
}); 

?

Preview template =>preview.php =>opens to a new tab

Create template =>save.php =>posts on same page

Answer 1

당신은 버튼을 모두 클릭 이벤트 처리기를 가지고 서로 동시 아약스 전화를 첨부 할 수 있습니다.

그리고 자바 스크립트를 사용하여 새 탭에서 창을 열 수 있습니다.

window.open(<url>) 

Answer 2

어떤 버튼을 클릭했는지에 따라 양식의 "target"속성을 설정해보십시오.

는 다음에 양식을 변경

:

<form id="create-template" class="form" action="" method="post" target="_blank"> 
    <p class="_50"> 
     <label for="t-name">Template name</label> 
     <input type="text" name="t-name" class="required"/> 
    </p> 
    <p class="_100"> 
     <label for="t-html">Template HTML</label> 
     <textarea id="t-html" name="t-html" class="required" rows="10" cols="40"></textarea> 
    </p> 
    <div class="clear"></div> 

    <div class="block-actions"> 
     <ul class="actions-left"> 
      <li><a class="button red" id="reset-template" href="javascript:void(0);">Clear</a></li> 
     </ul> 
     <ul class="actions-right"> 
      <li><input id="preview-form" type="submit" class="button" value="Preview template" /></li> 
      <li><input type="submit" id="submit-form" class="button" value="Create template" /></li> 
     </ul> 
    </div> 
</form>​ 

그리고이 자바 스크립트를 추가 : 나는 모든 브라우저에서이 테스트를하지 않은

$('#preview-form').click(function(ev) { 
    $('#create-template').attr('action', 'preview.php');  
    $('#create-template').attr('target', '_blank'); 
}); 

$('#submit-form').click(function(ev) { 
    $('#create-template').attr('action', 'submit.php'); 
    $('#create-template').attr('target', ''); 
}); 
​ 

, 당신이 작업을 수행 할 수 있습니다 있도록.