javascript - ドメイン間でフォーム機能の一部を再作成するか、別のサイトの単一フィールドに自動入力します

Question

高校のブースタークラブの募金方法として、Tictail ストアを立ち上げました。現金による寄付も集めたいと思っていますが、（簡単に言えば）クラブが潜在的な納税義務を回避するために、地区の財団を通じてこれらを集めたいと考えています. 財団には、ぜひ活用したいウェブフォームオプションがあります。（もし可能なら）

議論されているページへのサーバーアクセスはありません。

私が思いついたオプションは次のとおりです（優先順）：

オプション1：

Tictail サイトの Foundation Web サイトからフォームの関連部分を再作成 (スクレイピング?) し、Foundation サイトと同じ機能を提供します。

私はjQueryを試してきましたが、ちょっと迷っています。

オプション 2:

iframeFoundation サイトをTictail サイトにロードする
「Springfield Public Schools への寄付」の横にあるフィールドに、グループ名を自動入力します。
送信をクリックすると結果が開きますが、iframe では開きません

オプション 3:

Tictail サイトから財団サイトへのリンクをクリックすると、財団サイトがロードされます。
「Springfield Public Schools への寄付」の横にあるフィールドに、グループ名を自動入力します。

私は CSS と Javascript の経験が少しありますが、十分に危険です。ここの誰かが私の問題を理解し、解決策を提供してくれることを本当に望んでいます。

アップデート：

このコードを使用して、別のページのテスト環境で動作する送信ボタンを除くすべてを取得しました。

<script type="text/javascript" 
src="/jquery/jquery-1.3.2.min.js"></script>

<div id="container" align="center">

<p>Call the FSPS office at 417-523-0144 to donate or simply enter information below.</p>
<p><script type="text/javascript">// <![CDATA[
jQuery(document).ready(function () {
var updateTotals = function() {
    var total = 0;
    var description = "";
    if (!(isNaN(parseFloat(jQuery("#donateQty").val())) || parseFloat(jQuery("#donateQty").val()) <= 0)) {
        total += jQuery("#donateQty").val() * 1;
        description += "$" + jQuery("#donateQty").val() + " donation. ";
    }
    var processingFeeAmount = 0.0;
    if (jQuery("#donateProcessingFee").is(":checked")) {
        processingFeeAmount = total * 0.03;
        total += processingFeeAmount;
        jQuery("#processingFeeAmount").text("$" + processingFeeAmount.toFixed(2));
    }
    if (jQuery("#donateProject").val()) {
        description += " Donation designated for: " + jQuery("#donateProject").val() + ".";
    }
    if(jQuery("#donateAnonymously").is(":checked")) {
        description += " This is an anonymous donation.";
    }
    if (jQuery("#donateProcessingFee").is(":checked")) {
        description += " This includes a processing fee donation.";
    }
    jQuery("#totalPrice").text("$"+total.toFixed(2));
    jQuery("#x_amount").val(total.toFixed(2));
    jQuery("#x_description").val(description);
};
jQuery("#donateQty").change(function() {
    if (!isNaN(jQuery(this).val())) {
        jQuery("#donatePrice").text("$"+(jQuery(this).val()* 1).toFixed(2));
        updateTotals();
    }
});
    jQuery("#donateProject").change(function() {
            updateTotals();
    });
jQuery("#donateAnonymously").change(function() {
    updateTotals();
});
jQuery("#donateProcessingFee").change(function() {
    if (jQuery(this).is(":checked")) {
        jQuery("#trProcessingFeeAmount").show();
    } else {
        jQuery("#trProcessingFeeAmount").hide();
    }
    updateTotals();
});
});
</script></p>
<form method='POST'>
                        <input id='x_amount' name='x_amount' type='hidden' value='0' /> 
                        <input id='x_description' name='x_description' type='hidden' /> 
                        </p>
<table>
<tbody>
<tr>
<td style="text-align: left;">Donation amount:</td>
<td><input id="donateQty" style="width: 50px;" size="5" type="text" /></td>
<td></td>
<td><span id="donatePrice">$0.00</span></td>
</tr>
<tr id="trProcessingFeeAmount" style="display: none;">
<td style="text-align: right !important;" colspan="3">PROCESSING FEE DONATION:</td>
<td><span id="processingFeeAmount">$0.00</span></td>
</tr>
<tr>
<td style="text-align: right !important;" colspan="3">TOTAL AMOUNT DUE:</td>
<td><span id="totalPrice">$0.00</span></td>
</tr>
<tr>
<td style="text-align: left !important;" colspan="2">Donation should be directed to:</td>
<td style="text-align: right !important;" colspan="2"><input id="donateProject" style="width:     150px;" size="150" type="text" value="CHS Kilties" /></td>
</tr>
<tr>
<td colspan="4">
<div style="float: right; text-align: left;"><span><label for="donateAnonymously"><br />
<input id="donateAnonymously" type="checkbox" /> I wish to remain Anonymous.</label></span><span>            <label for="donateProcessingFee"><br />
<input id="donateProcessingFee" type="checkbox" /> Add 3% to my gift to cover processing fees, so 100% of my gift goes to FSPS.</label></span></div>
</td>
</tr>
<tr>
<td colspan="2"></td>
<td colspan="2"><input type="submit" value="Checkout" /></td>
</tr>
</tbody>
</table>
<p>
                   </form>

</div><!-- #content -->


<!--div id="footer" role="contentinfo">
</div--><!-- #footer -->

</div><!-- #wrapper -->
<div style="clear: both;"></div>
</div><!-- #container -->

<script type='text/javascript' src='http://supportsps.org/wp-content/plugins/contact-form- 7/jquery.form.js?ver=2.52'></script>
<script type='text/javascript' src='http://supportsps.org/wp-content/plugins/contact-form-7/scripts.js?ver=2.4.3'></script>
<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-15690751-2']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>

しかし、それを Tictail ページに貼り付けると、計算や機能がまったく機能しません。

javascript - ドメイン間でフォーム機能の一部を再作成するか、別のサイトの単一フィールドに自動入力します

1 に答える 1

Related

Reference