Question

这个focus函数允许我在Javascript中操作Select元素选项的值，我需要创建一个类似的函数来与下面的PHP函数一起使用。

在 Form 1 中，我预先选择了300多个Select元素最常用的选项，并且该函数（JS和jQuery的组合）允许我区分这些值何时仍然存在处于初始预选/默认状态与用户通过单击表单元素（表示他们主动决定将其设置为该值）主动选择该值时的比较。我在这里发布了一个小问题：http://jsfiddle.net/chayacooper/JHAPp/4/

我在PHP中创建一个类似的功能，无法在客户帐户页面上使用（允许用户编辑他们的信息）。下面的代码允许我正确地预先选择与db中的信息匹配的值，但我不知道如何修改代码，以便在用户没有关注元素时它将提交默认值。与第一种形式不同，我无法手动更改$ options数组中的实际值，因为它们可能已经为该字段选择了一个值。（目前我只是删除“_default”以使其工作）。

我猜我可能需要类似于原始函数的东西，但是使用值fetched而不是$ options数组值，这样如果元素没有被聚焦，我可以发布那个。

表单1 - HTML＆amp; JS功能

<select name="jeans">
    <option value="$0">$0</option>
    <option value="$50_default" selected="selected">$50</option>
    <option value="$100">$100</option>
    <option value="$150">$150</option>
</select>

$('select').focus(function () {
    var option = $(this).find("option[value*=default]");
    option.attr('value', option.attr('value').replace(/_default/g, ''));
});

表单2 - HTML＆amp; PHP

<?php
    try {  
        $stmt = $conn->prepare("SELECT * FROM price WHERE user_id = :user_id");  
        $stmt->bindValue(':user_id', $user_id); 
        $stmt->execute();
    }  catch(PDOException $e) {echo $e->getMessage();}
    $row = $stmt->fetch();
    $search_default = array('_default');
    $replace_default = array('');
    $row_default = str_replace($search_default, $replace_default, $row);
    // Pre-selects the option matching the db information
    function printSelectOptions($dataArray, $currentSelection) {
        foreach ($dataArray as $key => $value) {
            echo '<option ' . (($key == $currentSelection) ? 'selected="selected"' : '') . ' value="' . $key . '">' . $value . '</option>';
        }
    }
?>
<select name="jeans">
<?php
    // Generates a `Select` element 
    $options = array("Null"=>"", "$0"=>"$0", "$50"=>"$50", "$100"=>"$100", "$150"=>"$150");
    $selected = $row_default['jeans'];
    // Pre-selects the option matching the db information
    echo printSelectOptions($options, $selected); 
?> 
</select>

Answer 1

这是答案，礼貌的@JohnS惊人： - ）

// This is a helper function that replaces a key while maintaining the entry's
// position in the array. It does not modify the given array, but returns a
// new array.
function replaceKey($array, $oldKey, $newKey) {
    $newArray = array();
    foreach ($array as $key => $value) {
        $newArray[($key === $oldKey) ? $newKey : $key] = $value;
    }
    return $newArray;
}

$options = array("Null"=>"", "$0"=>"$0", "$50"=>"$50", "$100"=>"$100", "$150"=>"$150");

// We will change the key for the entry in $options so it includes "_default" if
// the value from the database includes "_default". We need to do this only if
// $row['jeans'] ends with "_default". That will be the case if these two are
// different.
if ($row_default['jeans'] !== $row['jeans']) {
    $options = replaceKey($options, $row_default['jeans'], $row['jeans']);
}

// Now we can use the value from the db for setting the selected value, rather
// than the value that had "_default" removed. 
$selected = $row['jeans'];

// Pre-selects the option matching the db information.
echo printSelectOptions($options, $selected);

我很难理解这不适用于我用于样式<select>元素（jQuery UI MultiSelect Widget和Dropkick）的两个jQuery插件因为这两个插件都不支持focus事件或标准click事件。

我修改了JS函数以使用MultiSelect Widget的自定义open事件，并在此处发布了一个小函数http://jsfiddle.net/chayacooper/dFyMq/

$(select).multiselect({ 
    open: function (event, ui) {
        var option = $(this).find("option[value*=default]");
        option.attr('value', option.attr('value').replace(/_default/g, ''));
        $(select).multiselect("refresh")
    }
});

将它与Dropkick一起使用要复杂得多，而且我已经发布了我在这里使用的方法的小提琴：http://jsfiddle.net/john_s/yhAX5/4/。此解决方法需要创建2组<select>元素 - 一组使用标准元素并隐藏（display:none），另一组使用Dropkick并且对用户可见。它还使用change()方法，因此如果用户点击下拉框然后有意识地决定保留“默认”值，则不会修改该值。

修改此JS Focus函数以使用动态设置Select选项的PHP函数

1 个答案: