动态更改iframe的src内容

时间:2012-02-07 08:57:27

标签: php javascript html

我正在制作一个搜索结果的页面。简要介绍一下,我有一个登录页面会引导你到另一个页面(让我们说主页)这个页面包含1个下拉框(和),1个文本框,1个按钮和1个iframe,其中包含我所拥有的页面我的桌子。现在我有一个显示在该表上的用户列表,其中包含firstname,lastname和middlename的标题,这是启动时显示的所有数据现在我从下拉框中选择了firstname,然后键入我的名字,这应该是导致过滤器为那些与我的名字相同的人。我在我的表格页面上使用了一个过滤器,我在其中添加参数,例如//localhost/test/table.php?fname=test

现在的问题是iframe应该是唯一一个会改变主页完整的iframe。现在iframe src将根据我在下拉框中选择的内容进行更改,因为我已经说过而不使用表单提交,值将基于文本框中的文本。如果可能的话,不使用src链接上的http://。

好吧我几乎完成了onclick的部分将使用这个脚本更改iframe页面:

<script type='text/javascript'>
        function goTo(){
        top.table.location = 'http://localhost/test/home.php; 
        }
        </script>

应该是这样的:

$dropdownvalue = dropdownselectedtext
$textvalue = valueoftextbox

//localhost/test/table.php?$dropdownvalue$textvalue

那么这是我的第一份工作。评论以便更好地理解。假设'#'后跟文本意味着一些值。供参考。

$acct_no = "#LOG_IN_ID OF USER";

            echo "<script type='text/javascript'>
            function goTo(){
            top.table.src = '#SOMEURLHERE'; 
            }
            </script>";

            echo "<table border='0' align='center' bgcolor='#ffffff' width='800px'>
            <tr>
                <td style='padding-left:30px;padding-top:20px;'>
                    <h3>SELECTION TEST</h3>
                </td>
                <td align='right' style='padding-right:30px;' height='120px'>
                    <select name='filter' id='filter'>
                        <option value='fname'>fname</option>
                        <option value='lname'>lname</option>
                        <option value='mname'>mname</option>
                    </select>
                    <input type='text' value='Enter text here' id='textbox'>
                    &nbsp; 
                    <input type='button' value='Search' onClick='goTo();'> //this should give me the filters e.g: #SOMEURLHERE.php?#selectedfiltervalue=#textboxvalue
                </td>
            </tr>
            <tr>
                <td colspan='2' align='center'>
                    <iframe src='table.php?ref=$acct_no' name='table' width='730px' height='300px' frameborder='0'></iframe> 
                </td>
            </tr>
            </table>";

3 个答案:

答案 0 :(得分:1)

尝试在下拉框中的onclick / onchange处理程序中使用此功能(对于每个值):

javascript: return goto(\"$dropdownvalue\", \"$textvalue\");

并且,加入它

<script type='text/javascript'>
    function goto(var1, var2){
        finLink = "http://localhost/test/table.php?" + var1 + var2
        top.table.location = finLink; //Not sure if it will be top.table.location or top.table.src
    }
</script>

答案 1 :(得分:1)

我建议您将<script>容器保留在PHP区域之外。

<script type="text/js" language="javascript">
    //Your function goes here
</script

<?php echo "<form name='someName' action='#'>
echo "<table border='0' align='center' bgcolor='#ffffff' width='800px'>
<tr>
    <td style='padding-left:30px;padding-top:20px;'>
        <h3>SELECTION TEST</h3>
    </td>
    <td align='right' style='padding-right:30px;' height='120px'>
        <select name='filter' id='filter'>
    <option value='fname'>fname</option>
    <option value='lname'>lname</option>
    <option value='mname'>mname</option>
        </select>
        <input type='text' value='Enter text here' id='textbox'>
        &nbsp; 
        <input type='button' value='Search' onClick='javascript: return goTo(\"this.parent.filter.value, this.parent.textbox.value\");'> //this should give me the filters e.g: #SOMEURLHERE.php?#selectedfiltervalue=#textboxvalue
    </td>
</tr>
<tr>
    <td colspan='2' align='center'>
        <iframe src='' name='table' width='730px' height='300px' frameborder='0'></iframe> 
    </td>
</tr>
</table></form>";?>

您在整个部分中未使用<form>标记,因此难以管理字段。另外,试试我在之前的帖子中定义的javascript。

答案 2 :(得分:0)

您可以使用jquery:

$('#myiframeid').attr('src', 'http://some.url.here');