我如何根据所选的选项动态更改文本区域?

时间:2013-06-13 14:43:02

标签: php jquery html ajax textarea

所以基本上我要做的就是创建一个模板电子邮件表单来发送。 用户可以从html文件或mysql数据库中已存在的预定义模板选项中进行选择。

一旦用户从选项中选择,文本将自动加载到已经很好的文本区域。

我正在使用PHP,Jquery,Javascript来构建它。

我正在调查几个MC编辑器,还没有确定html是保存在文件还是mysql数据库中。

相当新鲜。我从哪里开始?

2 个答案:

答案 0 :(得分:1)

change()个函数可用于查看select何时更改。然后,您可以检查所选选项的值并执行您需要执行的操作。快速举例:

<select>
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
</select>

你的jQuery:

$("select").change(function() {
    if (this.value == "1") {
        console.log("User picked the first option");
        $("textarea").val("User picked option one!"); //Adds content to a textarea

        //make some ajax call
        $.ajax({
            url: "/call/",
            ...
            ...
            success: function() {
                //successful!
            }
        });
    }
});

这应该是一个很好的起点,可以满足您的需求。

答案 1 :(得分:0)

我在这里做了一个jsfiddle

http://jsfiddle.net/rtP9c/8/

看看是否有帮助

<div id="email">
To <div class="template name">2</div><br/>

I am Jack's email template. I am a unique and beautiful <div class="template insect"></div>. Did you know that you are not your <div class="template possession"></div>.<br>

From <div class="template from"></div>
</div>

JS:

var email = {
    name : 'Tyler', 
    insect : 'butterfly', 
    possession : 'Khaki Pants', 
    from : 'Narrator'
};

$('.template').each(function(k,v){
   var template = $(this).attr('class').split(' ')[1];
    $(this).text(email[template]);
});

或通过AJAX:

   $.ajax({
      url: 'http://site.com'
      dataType: 'json',
      data : data,
      success: function(data) {
        $('.template').each(function(k,v){
            var template = $(this).attr('class').split(' ')[1];
            $(this).text(data[template]);
        });        
      },
      error: function(status) {
        console.log(status);
      }
    });