如何在jquery中选择更改时更新div [英] How to update div when on select change in jquery

问题描述

我有一个带有select字段和div的表单，我希望根据用户选择的值来更新值。

I have a form with a select field and a div i wish to update with a value depending on what the user selects.

示例：

<select name="mysel" id="msel">
    <option value="test1">Test1</option>
    <option value="test2">Test2</option>
    <option value="test3">Test3</option>
</select>

<div id="myresult"></div>

我想要div更新为This is test 2 and other info，如果用户选择test2等等。

I would like the div to update with "This is test 2 and other info" if the user selects test2 and so on.

任何帮助都将不胜感激。

Any help on this would be greatly appreciated.

推荐答案

尝试类似的方法：

Try something like that :

<select id="choose">
    <option value="test1">Test1</option>
    <option value="test2">Test2</option>
    <option value="test3">Test3</option>
</select>
<div id="update"></div>

<script type="text/javascript">
    $('#choose').change(function(event) {
        $('#update').html('This is ' + $('#choose').val() + ' and other info');
    }); 
</script>

---

如果您想使用AJAX， javascript函数就像这样：

---

If you want to make it with AJAX, change the javascript function to something like that:

<script type="text/javascript">
    $('#choose').change(function(event) {
        $.post('info.php', { selected: $('#choose').val() },
            function(data) {
                $('#update').html(data);
            }
        );            
    });
</script>

在你的info.php中，你会看到类似的内容：

And in your info.php, you'll have something like:

<?php

    $selected = isset($_POST['selected']) ? $_POST['selected'] : 'nothing';
    echo("This is $selected and other info");

这篇关于如何在jquery中选择更改时更新div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！