Question

我试图将存储在div标签内的值传递给基于HTML下拉菜单的onchange属性的javascript函数。

但没有任何事情通过。显示未定义的错误。

这是我的代码：

假设$temp_c的值为30。

<span id="temperature_div"><?php echo $temp_c; ?></span>

<label for="ddl_temptype"></label>
<select id="ddl_temptype" name="ddl_temptype" onchange="choose_temperature(this.value,temperature_div.value,temperature_div.name); ">
    <option value="celcius" selected>°C</option>
    <option value="farenheit">°F</option>
</select>

和JavaScript

function choose_temperature(conv, value, name) {
    alert(conv);
    alert(value);
    alert(name);
}

我哪里出错？

Answer 1

在JavaScript中，您不能仅使用temperature_div作为变量，并假设它将是ID为temperature_div的对象。有从DOM中获取元素的函数。在纯JavaScript中：document.getElementById('temperature_div')将返回元素。如果您正在使用JQuery，那么$('#temperature_div')将会做类似的事情。

编辑：

尝试此功能：

function choose_temperature(conv) {
    alert(conv);
    var element = document.getElementById('temperature_div');
    alert(element.innerHTML);
    alert(element.attributes["name"].value);
}

被称为：choose_temperature(this.value);

修改：已更改为使用innerHTML和attributes["name"].value而非value和name。我假设这些都是想要的。

Answer 2

首先，您使用了参数＆＃39; value＆＃39;我认为这是一个关键词，最好不要使用。我假设你指的是这个名字＆＃39;您未定义的＆＃39; temperature_div＆＃39;中的html属性。我只是为了理解而提出名称属性。

<html>

<script type="text/javascript">


    function choose_temperature(conv, t_value, name) 
            {
                alert(conv);
                var div = document.getElementById("temperature_div");
                alert(div.innerHTML);
                alert(div.getAttribute("name"));
            }
    </script>

<label for="ddl_temptype"></label>
<select id="ddl_temptype" name="ddl_temptype" onchange="choose_temperature(this.value); ">
    <option value="celcius" selected>°C</option>
    <option value="farenheit">°F</option>
</select>

Answer 3

在javascript中使用getElementById()

<span id="temperature_div"><?php echo $temp_c; ?></span>

    <label for="ddl_temptype"></label>
    <select id="ddl_temptype" name="ddl_temptype" onchange="choose_temperature(); ">
  <option value="celcius" selected> °C</option>
 <option value="farenheit"> °F</option>
  </select>


function choose_temperature()
{
    var value=document.getElementById('temperature_div').innerHTML; //to get html inside span
     var conv=document.getElementById('ddl_temptype').value;

    alert(conv);
    alert(value);

}

Answer 4

使用jquery代替，它更容易。

在div中获取值：$（'＃temperature_div'）。html（）或$（'＃temperature_div'）。text（）

您可以将选择框的onchange写为：

$(document).on('change', '#ddl_temptype', function() {

  // Write your function here
  var div_value = $('#temperature_div').html();
  var select_val = $(this).val();


 alert(div_value);

});

或者像这样

$('#some_id').on('change', function() {

   // Write your function here
      var div_value = $('#temperature_div').html();
      var select_val = $(this).val();


     alert(div_value);
});

如何传递id，name＆amp; div标签的值为javascript函数

4 个答案: