0

単一のモーダルフォームを開く次のスニペットがあります。

<a class="modalbox" id="foo" href="#inline">Request a Quote</a>
<a class="modalbox" id="bar" href="#inline">Request a Quote</a>
...and so on...

どういうわけか、次のHTMLフォームの入力「sub」のIDの値をレンダリングし、IDを「興味があります...」という所定のテキストと連結する必要があります。

<form id="contact" name="contact" action="#" method="post">
    <input type="hidden" id="product" name="product" value="">
    <label for="sub">Subject:</label>
    <input type="sub" id="sub" name="sub" class="txt" value="I am interested in '$id'">
    <button id="send">Submit</button>

私はすでに検証にJavascriptを使用し、PHPスクリプトへの処理にAJAXを使用しています。

編集：これは、上記の非表示の入力を入力するためにすでに使用されているJavascriptであり、完全に機能しています。

$('a').click(function(e) {

 $('#product').val($(this).attr('id'));
4

1 に答える 1

0

プレーンJavaScriptを使用して、次のようなものを提案します。

function addTextToInput(from, to, prefix, e) {
    e = e || window.event;
    if (!from || !to) {
        return false;
    }
    else {
        from = from.nodeType == 1 ? from : document.getElementById(from);
        to = to.nodeType == 1 ? to : document.getElementById(to);
        var text = from.id;
        to.value = prefix ? prefix + ' ' + text : text;
    }
}

var as = document.querySelectorAll('a.modalbox');
for (var i = 0, len = as.length; i<len; i++) {
    as[i].onclick = function(e) {
        addTextToInput(this, 'sub', 'I am interested in', e);
    };
}​

JSフィドルデモ。

しかし、すでにjQueryを使用しているように思われる場合：

$('a.modalbox').click(function(e){
    e.preventDefault();
    $('#sub').val('I am interested in ' + this.id);
});

JSフィドルデモ。

于 2012-10-23T20:13:11.013 に答える