web-dev-qa-db-ja.com

送信ボタンのMailto

mailto:のような送信ボタンに<input type="submit" />関数を実装することは可能ですか？ ASP.NET MVCを使用しています。これを実現するためのコントローラーアクションの結果がいくつかあるかもしれません。手伝っていただけませんか？

追伸アンカーをボタンのように見せることができることを知っています。

htmlasp.net-mvcmailto
17
Pavel Shchegolevatykh

HTMLでは、mailto:要素の<form>属性で[action]アドレスを指定できます。

<form action="mailto:[email protected]" method="GET">
    <input name="subject" type="text" />
    <textarea name="body"></textarea>
    <input type="submit" value="Send" />
</form>

これにより、ユーザーのメールクライアントは、<form>のフィールドが事前入力されたメールを作成できます。

これがしないすることはメールを送ることです。

35
zzzzBov

これはうまくいくようです：

        <button onclick="location.href='mailto:[email protected]';">send mail</button>
25
Greald Henstra

行う必要があるのは、form。でonchangeイベントを使用し、メールのコンテキストに応じて送信ボタンのhref属性を変更することです。

<form id="form" onchange="mail(this)">
                    <label>Name</label>
                    <div class="row margin-bottom-20">
                        <div class="col-md-6 col-md-offset-0">
                            <input class="form-control" name="name" type="text">
                        </div>
                    </div>

                    <label>Email <span class="color-red">*</span></label>
                    <div class="row margin-bottom-20">
                        <div class="col-md-6 col-md-offset-0">
                            <input class="form-control" name="email" type="text">
                        </div>
                    </div>

                    <label>Date of visit/departure </label>
                    <div class="row margin-bottom-20">
                        <div class="col-md-3 col-md-offset-0">
                            <input class="form-control w8em" name="adate"  type="text">
                                <script>
                            datePickerController.createDatePicker({
                                // Associate the text input to a DD/MM/YYYY date format
                                formElements:{"adate":"%d/%m/%Y"}
                                });
                                </script>
                        </div>
                        <div class="col-md-3 col-md-offset-0">
                            <input class="form-control" name="ddate"  type="date">
                        </div>
                    </div>

                    <label>No. of people travelling with</label>
                    <div class="row margin-bottom-20">
                        <div class="col-md-3 col-md-offset-0">
                            <input class="form-control" placeholder="Adults" min=1 name="adult"  type="number">
                        </div>
                        <div class="col-md-3 col-md-offset-0">
                            <input class="form-control" placeholder="Children" min=0 name="childeren"  type="number">
                        </div>
                    </div>

                    <label>Cities you want to visit</label><br/>
                    <div class="checkbox-inline">
                      <label><input type="checkbox" name="city"  value="Cassablanca">Cassablanca</label>
                    </div>
                    <div class="checkbox-inline">
                      <label><input type="checkbox" name="city" value="Fez">Fez</label>
                    </div>
                    <div class="checkbox-inline">
                      <label><input type="checkbox" name="city" value="Tangier" >Tangier</label>
                    </div>
                    <div class="checkbox-inline">
                      <label><input type="checkbox" name="city" value="Marrakech" >Marrakech</label>
                    </div>
                    <div class="checkbox-inline">
                      <label><input type="checkbox" name="city" value="Rabat" >Rabat</label>
                    </div>

                    <div class="row margin-bottom-20">
                        <div class="col-md-8 col-md-offset-0">
                            <textarea rows="4" placeholder="Activities Intersted in" name="activities" class="form-control"></textarea>
                        </div>
                    </div>


                    <div class="row margin-bottom-20">
                        <div class="col-md-8 col-md-offset-0">
                            <textarea rows="6" class="form-control" name="comment" placeholder="Comment"></textarea>
                        </div>
                    </div>

                    <p><a id="send" class="btn btn-primary">Create Message</a></p>
                </form>

関数mail（form）{

            var name=form.name.value;
            var city="";
            var adate=form.adate.value;
            var ddate=form.ddate.value;
            var activities=form.activities.value;
            var adult=form.adult.value;
            var child=form.childeren.value;
            var comment=form.comment.value;
            var warning=""
            for(i=0;i<form.city.length;i++)
            {
                if(form.city[i].checked)
                    city+=" "+form.city[i].value;
            }
            var str="mailto:[email protected]?subject=travel to morocco&body=";
            if(name.length>0){
                str+="Hi my name is "+name+", ";
            }else{
                warning+="Name is required"
            }
            if(city.length>0){
                str+="I am Intersted in visiting the following citis: "+city+", ";
            }
            if(activities.length>0){
                str+="I am Intersted in following activities: "+activities+". "
            }
            if(adate.length>0){
                str+="I will be ariving on "+adate;
            }
            if(ddate.length>0){
                str+=" And departing on "+ddate;
            }
            if(adult.length>0){
                if(adult==1&&child==null){
                str+=". I will be travelling alone"
                }else if(adult>1){
                    str+=".We will have a group of "+adult+" adults ";
                }
                if(child==null){
                    str+=".";
                }else if(child>1){
                    str+="along with "+child+" children.";
                }else if(child==1){
                    str+="along with a child.";
                }
            }

            if(comment.length>0){
                str+="%0D%0A"+comment+"."
            }

            if(warning.length>0){
                alert(warning)
            }
            else{
            str+="%0D%0ARegards,%0D%0A"+name;
            document.getElementById('send').href=str;
            }
    }
3
Mihir Parmar

HTMLベースの電子メール作成フォームの可能なフィールドの完全なリスト：

  • subject
  • cc
  • bcc
  • 体

<form action="mailto:[email protected]" method="GET"> <input name="subject" type="text" /></br> <input name="cc" type="email" /><br /> <input name="bcc" type="email" /><br /> <textarea name="body"></textarea><br /> <input type="submit" value="Send" /> </form>

https://codepen.io/garfunkel61/pen/oYGNGp

1
garfunkel61

または、action：mailtoでフォームを作成できます

<form action="mailto:[email protected]">

これをチェックしてください。

http://webdesign.about.com/od/forms/a/aa072699mailto.htm

しかし、これは実際に電子メールを介してフォームを送信します。これはあなたが望んでいたものですか？ただ使用することもできます

<button onclick="">そして、これを実現するためのJavaScriptを使用します。

そして、<a>ボタンのように見えます。これを回避する方法はたくさんあります。少し検索してください。

1
geekman

「ボタン」タグに「a」タグを含めるだけです。

<button><a href="mailto:..."></a></button>
0
Nancy