入力型サブ要素の背後に提出

Question

私は入力型サブミットを使用しましたが、今はボタンスタイルに変更したいと思います。この目的を達成するために、私は以下のコードを使用している：私は入力型上記buttoninner div要素を配置している

<div class="cartbutton"> 
    <input type="submit" name="shortname" value="product1" class="add_to_cart" /> 
    <div class="buttoninner"> 
      <div class="buttontext">Add to Cart</div><div class="cartimage"></div> 
    </div> 
</div> 

を下記のCSS使用して提出：残念ながら

.cartbutton { 
    position: relative; 
    width: 178px; 
} 

.add_to_cart { 
    background: none repeat scroll 0 0 transparent; 
    border: 0 none; 
    cursor: pointer; 
    height: 38px; 
    opacity: 0; 
    width: 177px; 
    z-index: 2; 
} 

.buttontext { 
    background-color: #333333; 
    border: 0 none; 
    color: white; 
    cursor: pointer; 
    float: left; 
    font-family: "Segoe UI",helvetica,arial,sans-serif; 
    font-size: 20px; 
    padding: 5px 20px; 
} 
.cartimage { 
    background-color: #F7941D; 
    background-image: url("/Content/en-US/Sales/Images/small_cart.png"); 
    background-position: 5px 50%; 
    background-repeat: no-repeat; 
    float: left; 
    height: 38px; 
    width: 40px; 
} 
.buttoninner { 
    position: absolute; 
    top: 0; 
    z-index: 1; 
} 

を、ボタンポストは動作しません。 div要素の背後にあるsubmitボタンをどのようにアクティブにすることができますか？

Answer 1

あなたのボタンが実際にクリックされていないのは、その上にdivがオーバーレイされているためです。あなたができることは、あなたのdivにonclickイベントを与え、それを介してサブミットアクションを処理することです。あなたはあなたがPHPのエコーの任意の場所でボタンを作成したり、それを印刷することができます

Answer 2

why are you using div you can use 
<input type="image" src="image path"> 
    it also works like submit 

Answer 3

<div class="cartbutton" > 
<input type="submit" name="shortname" value="product1" class="add_to_cart" /> 
<div class="buttoninner"> 
<div class="buttontext">Add to Cart</div><div class="cartimage"></div> 
</div> 
</div> 

<script type="text/javascript"> 
$('.cartbutton').click(function(){ 
$('#formid').submit(); 
    }); 
    </script> 
use jquery 

Answer 4

その場合には別の送信ボタンを必要としません。 Cssクラスは要件ごとに変更できます。

print "<div class='links' id='edit-submit'><input type='button' class='form-submit' value='Signup to Invitation' onClick=\"location.href='?q=rsvp/".$rsvp->rid."/register';\" \></div>";