0

我正在尝试通过 javascript 将用户重定向到另一个链接。当用户从单选框中选择一个选项并单击按钮时,javascript 会将用户重定向到类似 sitename.com/events/text-which-user-selected-from-radio-box 的链接。我正在从 php 获取单选框数据。这是我的代码,

<?php

foreach ($words as $word){   
         if($results > 3)
             echo "<input name='tuh' type='radio' id='".str_replace(' ', '-', $word->name)."' value='".$word->name."'/>". $word->name."|".get_permalink($word->ID)."\n"."<br/>";

        else
             echo "<input name='tuh' type='radio' id='".str_replace(' ', '-', $word->name)."' value='".$word->name."'/>".$word->name."\n"."<br/>"; 


    }

    ?>
<input type='button' value='write review' onclick="js_tuh()" />

这段代码像这样返回 HTML,

<input name='tuh' type='radio' id='Amsterdam-International-Salsa- Congress'     value='Amsterdam International Salsa Congress'/>Amsterdam International Salsa Congress|
<br/>
<input name='tuh' type='radio' id='Amsterdam-Salsa-&amp;-Zouk-Festival'          value='Amsterdam Salsa &amp; Zouk Festival'/>Amsterdam Salsa &amp; Zouk Festival|



我还在 javascript 中使用了 php,这是我的 javascript 代码,

<script type='text/javascript'>

        function js_tuh(){

        <?php

            foreach ($words as $word){

        ?>
            id_tuh=document.getElementById("<?php echo str_replace(' ', '-', $word->name); ?>");

             if(id_tuh.checked == true){
            // alert(id_tuh.value);
            window.location = "http://beta.salsatraveladvisor.com/events/"+id_tuh.id; 
             }
            <?php } ?>
            }

        </script>

并且php返回这样的javascript代码,

    <script type='text/javascript'>

        function js_tuh(){

    id_tuh=document.getElementById("Amsterdam-  International-Salsa-Congress");

             if(id_tuh.checked == true){
             alert(id_tuh.value);
             //alert(id_tuh.value);
    //window.location.replace("http://www.salsatraveladvisor.com/events/"+id_tuh.value);
            window.location = "http://beta.salsatraveladvisor.com/events/"+id_tuh.id; 
             }
   id_tuh=document.getElementById("Amsterdam-Salsa-&amp;-Zouk-Festival");

             if(id_tuh.checked == true){
             alert(id_tuh.value);
             //alert(id_tuh.value);
    //window.location.replace("http://www.salsatraveladvisor.com/events/"+id_tuh.value);
            window.location = "http://beta.salsatraveladvisor.com/events/"+id_tuh.id; 
             }
                            }

        </script>

当我单击第一个单选框并单击按钮时,它工作正常。但是当我选择第二个单选框并单击提交按钮时,它会返回

TypeError: id_tuh 为 null [中断此错误]

如果(id_tuh.checked == true){

请给我一个建议,我现在应该怎么做。

4

1 回答 1

1
id_tuh=document.getElementById("Amsterdam-Salsa-&amp;-Zouk-Festival");

是错误的ID。这个 HTML:

<input name='tuh' type='radio' id='Amsterdam-Salsa-&amp;-Zouk-Festival'          value='Amsterdam Salsa &amp; Zouk Festival'/>

生成 ID Amsterdam-Salsa-&-Zouk-Festival——HTML 实体在属性中仍然可以很好地解释——所以你需要使用它。

当然,更好的解决方案是生成和使用不包含与号或大写字符的实际 slug。

function slug($name) {
    return preg_replace('/[^a-z]+/', '-', strtolower($name));
}

echo '<input name="tuh" type="radio" id="', slug($word->name),
     '" value="', htmlspecialchars($word->name), '" />',
     htmlspecialchars($word->name, ENT_NOQUOTES), '|',
     get_permalink($word->ID), "\n<br/>";

此外,我不得不交换引号以确保准确性htmlspecialchars,但无论如何它看起来更好。

于 2013-07-15T16:30:52.487 回答