문제

다른 페이지에 링크를 사용하는 이미지가 있습니다. <a href="..."> <img ...> </a>.

버튼 인 경우 게시물을 만드는 방법 <input type="submit"...>?

도움이 되었습니까?

해결책

<input type="image" name="your_image_name" src="your_image_url.png" />

이것은 보낼 것입니다 your_image_name.x 그리고 your_image_name.y 값은 양식을 제출할 때 사용자가 이미지를 클릭 한 위치의 x 및 y 좌표 인 양식을 제출합니다.

다른 팁

보다 일반적인 애호가 사용 jQuery 도서관 가장 가까운() 그리고 제출하다() 버튼. 여기에서 제출하려는 Whitch 양식을 지정할 필요가 없습니다.

<a href="#" onclick="$(this).closest('form').submit()">Submit Link</a>

이미지를 사용하여 양식을 제출하려고하는 것 같습니다 ...이 경우 사용<input type="image" src="...">

앵커를 정말로 사용하려면 JavaScript를 사용해야합니다.

<a href="#" onclick="document.forms['myFormName'].submit(); return false;">...</a>

입력 유형 = 이미지 당신을 위해 그것을 할 것입니다.

테스트되지 않은 / 더 나을 수 있습니다 :

<form action="page-you're-submitting-to.html" method="POST">
    <a href="#" onclick="document.forms[0].submit();return false;"><img src="whatever.jpg" /></a>
</form>
 <html>

 <?php

 echo $_POST['c']." | ".$_POST['d']." | ".$_POST['e'];

 ?>

 <form action="test.php" method="POST">
      <input type="hidden" name="c" value="toto98">
      <input type="hidden" name="d" value="toto97">
      <input type="hidden" name="e" value="toto aaaaaaaaaaaaaaaaaaaa">

      <a href="" onclick="document.forms[0].submit();return false;">Click</a> 
 </form>

</html>


So easy.




So easy.

이에 편리하게 추가 할 수있는 것은 추가 버튼에서 포스트 오를 변경하여 다른 버튼이있는 다른 URL에 게시 할 수 있다는 것입니다. 양식 '액션'속성을 설정하여 달성 할 수 있습니다. jQuery를 사용할 때의 코드는 다음과 같습니다.

$('#[href button name]').click(function(e) {
    e.preventDefault();
    $('#[form name]').attr('action', 'alternateurl.php');
    $('#[form name]').submit();
});

Action-Attribute에는 이전 jQuery 버전과 관련된 몇 가지 문제가 있지만 최신 정보를 얻을 수 있습니다.

무엇 이 페이지를 좋아합니다 ?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>BSO Communication</title>

<style type="text/css">
.submit {
    border : 0;
    background : url(ok.gif) left top no-repeat;
    height : 24px;
    width : 24px;
    cursor : pointer;
    text-indent : -9999px;
}
html:first-child .submit {
    padding-left : 1000px;
}
</style>
<!--[if IE]>
<style type="text/css">
.submit {
    text-indent : 0;
    color : expression(this.value = '');
}
</style>
<![endif]-->
</head>

<body>
    <h1>Display input submit as image with CSS</h1>

    <p>Take a look at <a href="/2007/07/26/afficher-un-input-submit-comme-une-image/">the related article</a> (in french).</p>
    <form action="" method="get">
        <fieldset>
            <legend>Some form</legend>
            <p class="field">
                <label for="input">Some value</label>

                <input type="text" id="input" name="value" />
                <input type="submit" class="submit" />
            </p>
        </fieldset>
    </form>

    <hr />
    <p>This page is part of the <a href="http://www.bsohq.fr">BSO Communication blog</a>.</p>

</body>
</html>

"버튼"요소를 잊지 마세요.

우리는 제출 버튼을 항상 양식으로 바꾸는 것입니다.

<form method="post" action="whatever.asp">
<input type=...n

<input type="image" name="Submit" src="/graphics/continue.gif" align="middle" border="0" alt="Continue">
</form>

이미지를 클릭하면 양식이 제출됩니다. 도움이되기를 바랍니다!

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top