Question

我网站的每篇文章都有一个唯一的ID号。当用户点击阅读文章时，我使用函数来获取当前的文章ID，因此下拉列表中的相同值的选项将自动选择。

例如，如果我点击ID = 79的文章

<option value="0" >Please Choose</option>
<option value="97" <?php echo $postid == '97' ? 'selected="selected"' : '';?> >This is 97</option>
<option value="98" <?php echo $postid == '98' ? 'selected="selected"' : '';?> >This is 98</option>

我的下拉列表将选择“这是97”选项。

这里的问题是我使用一个jQuery脚本，在选择时显示一个表单，如下所示：

<script language='JavaScript'>
$(document).ready(function() {
$('#termid').change(function() {
var val = $(this).val();
$('#reservationdetails').empty().addClass('loading').load('../kratisis/forms/' + val + '.php', function(){$('#reservationdetails').removeClass('loading') });
});
});
</script>

<div id="reservationdetails"></div>

当用户进入阅读第97条时，所选的选项将是“这是97”，但是除非我选择98然后再回到97，否则将不会显示请求的php文件（来自jQuery）。

我的问题是如何处理这个问题？我的意思是当用户首先输入文章时如何显示额外的php文件，但是当下拉值更改时替换它？

我想过使用<?php include("") ?>，但假设我在97并点击98，将会有2个额外的php文件。

感谢您的想法。

Answer 1

你应该尝试jQuery trigger

$('#termid').trigger('change');

确保在您为变更事件绑定了回调函数后使用触发器。

Answer 2

您在更改时触发了匿名函数，但您还需要在页面加载时触发它。将匿名函数抽象为命名函数：

var loadPage = function(val) {
  $('#reservationdetails')
    .empty()
    .addClass('loading')
    .load('../kratisis/forms/' + val + '.php', function(){
      $('#reservationdetails').removeClass('loading');
    });
}

然后将其绑定到change，并最初调用它：

loadPage($('#termid').change(function() { loadPage($(this).val()); }).val());

（你可以在一行上完成所有这一切，因为.change()将返回#termid的jQuery对象。）

Answer 3

首先，这种事件应该是一个功能：

$(document).ready(function () {
    load_article = function (article_id) {
        $('#reservationdetails').empty()
        .addClass('loading')
        .load('../kratisis/forms/' + val + '.php', function () {
            $('#reservationdetails').removeClass('loading')
        });
    };
});

那么为什么不使用ajax()代替load()？

$(document).ready(function () {
    load_article = function (article_id) {
        $.ajax({
            url: '../kratisis/forms/' + article_id + '.php',
            beforeSend: function () {
                $('#reservationdetails').html('').addClass('loading')
            },
            success: function (data){
                // Assuming that #reservationdetails is the articles text area
                $('#reservationdetails').html(data).removeClass('loading')
            }
        });
    };
});

现在您可以在第一页加载时添加默认文章。还有改变事件：

$(document).ready(function () {
    var default_article = 1;

    // Article chaning function
    load_article = function (article_id) {
        $.ajax({
            url: '../kratisis/forms/' + article_id + '.php',
            beforeSend: function () {
                $('#reservationdetails').html('').addClass('loading')
            },
            success: function (data){
                // Assuming that #reservationdetails is the articles text area
                $('#reservationdetails').html(data).removeClass('loading')
            }
        });
    };

    // Add the change event to the select
    $('#termid').change(function () {
        load_article($(this).val());
    });

    // Sets a default article on first page load
    load_article(default_article);
});

如何在页面加载时加载php文件（提供jQuery）

3 个答案: